Sergei
Sergei

Reputation: 37

3px border-radius has different look in IE and other browsers

This CSS produce different results in latest browsers:

input {
    border:1px solid #ccc;

    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

The radius size in IE is smaller:

enter image description here

How do I fix this?

Upvotes: 1

Views: 474

Answers (2)

glenderson
glenderson

Reputation: 66

Change the IE specific value by 1px,

border-radius: 4px; (instead of 3px)

Upvotes: 0

Mr_Green
Mr_Green

Reputation: 41832

The versions of IE till 8.0 doesnot support Border-radius as far as i know. So I used transparent PNG images which I have created instead of Div's which needs border-radius and also it solved the browser compatibility issues.

EDIT For IE9: you may be using quirks mode that's why it is not compatible.

Upvotes: 2

Related Questions