border radius CSS in IE browser

Question

I have a div with border radius, I write the CSS code for all the browsers:

border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;

but in IE it doesn't work! What should I do?

research online. there are tons of solutions – JokerMartini Jul 13 '15 at 15:43 — JokerMartini, Jul 13 '15 at 15:43

score 2 · Answer 1 · edited May 23 '17 at 12:29

2

Border radius does not work in IE until version 9.

See: Support for "border-radius" in IE

There are some suggestions on that answer as well as on Google for alternatives.

You may be required to use images for your rounded corners. You may be able to use a JavaScript based re-creation of rounded corners.

edited May 23 '17 at 12:29

Community

1
1

answered Sep 08 '11 at 13:18

700 Software

85,281
83
234
341

score 1 · Answer 2 · answered Sep 08 '11 at 13:18

If you're using IE8 or older, you have to do that with images or some sort of javascript plugin. If you're using IE9 or newer, then that code works perfectly fine.

Here are some jQuery plugins that could solve your problem: http://plugins.jquery.com/plugin-tags/border-radius

score 1 · Accepted Answer · answered Sep 08 '11 at 13:26

1

I think using PIE.htc for all css3 styles will be better. I have used it in many of my projects and works fine in IE7/8/9.

Here is the link. http://css3pie.com/ This will provide you various demos for that and it is really helpful. Thanks.

answered Sep 08 '11 at 13:26

gautamlakum

11,815
23
67
90

I don't no what happened... I change something in the page and the border disappeared! Do you know what? – rivka Sep 08 '11 at 15:21

score 0 · Answer 4 · answered Sep 08 '11 at 13:31

0

Nifty Corners works as well in IE8.

Here is an example: http://jsfiddle.net/jCm7T/1/

answered Sep 08 '11 at 13:31

Bryan Weaver

4,455
1
29
39

border radius CSS in IE browser

4 Answers4