Css: -webkit-border-radius for Internet explorer?

Question

Hi,

I want to set border for a div,

Using: -webkit-border-radius working fine on Chrome but it is not working for Internet explorer, triple versions: ie 6, 7 and 8 :D

Is there any other attribute like -webkit-border-radius specifying for IE?

Thanks in advance.

Answer 1

CSS properties that begin with a hyphen are vendor-prefixes:

• -webkit (for Webkit browsers, Chrome and Safari)
• -o (for Opera)
• -moz (for Firefox and, I think, for the Gecko rendering engine)
• -ms (for IE)
• -khtml (for Konqueror)

These prefixes are ignored by the other browser engines.

-webkit-border-radius is targeted to Webkit's implementation of the border-radius property. So far as I know border-radius won't be implemented by IE until IE 9.

Answer 2

IE has yet to implement the border-radius CSS property. I believe with IE9 they will be implementing it. As for alternative options and an explanation from the team themselves, here is a link:

Rounded Corners in Internet Explorer

Here is another SO link as well that has more detail:

Support for “border-radius” in IE

One more, here is an official MSDN blog posting discussing the topic:

The CSS Corner: About CSS corners

Answer 3

Try using CSS3Pie. It very easily lets you adapt CSS3 decorators for IE.

I did a small demo of it with Sass a few days ago, if you'd like to check it out in IE.