How we can enable border-radius in IE?

Question

<style>
   border-radius:10px;
</style>
<div class='radius'> <?= echo $score . 'score';?></div>

It is not working in IE8

possible duplicate of [CSS - border-radius help](http://stackoverflow.com/questions/1285014/css-border-radius-help) — Pascal, Jun 22 '12 at 23:38

Idrizi.A · Answer 1 · 2012-06-23T13:11:38.350

5

Border-Radius is not supported in Internet Explorer 6-8, in IE 9 use border-radius:10px.

It can work with Jquery or PIE CSS

In HTML add jquery.js and jquery.corner.js:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://malsup.github.com/jquery.corner.js"></script>

Javascript

$('.radius').corner();

For border-radius: 10px use

$('.radius').corner("10px");

for more examples: http://jquery.malsup.com/corner/

DEMO http://jsfiddle.net/vTXXD/

edited Jun 23 '12 at 13:11

answered Jun 22 '12 at 23:45

Idrizi.A

9,819
11
47
88

I know that plugin works. I have seen it before, and it is a pretty nice plugin. However, it is not the only option. PIE CSS works too. So jquery is not the **only** option. – Josh Mein Jun 22 '12 at 23:48
but your first comment is "That is not true" – Idrizi.A Jun 22 '12 at 23:51
I was saying that it is not true that jquery is the only option. Hence I said that you can use tools such as PIE CSS. – Josh Mein Jun 22 '12 at 23:52

score 2 · Accepted Answer · answered Jun 22 '12 at 23:38

2

It is not supported in IE8. If you want it to work in IE8 you need to use a hack.

answered Jun 22 '12 at 23:38

John Conde

217,595
99
455
496

1

+1 Border radius is only supported in IE9 and later versions. http://stackoverflow.com/questions/635851/support-for-border-radius-in-ie – kol Jun 22 '12 at 23:39

score 2 · Answer 3 · answered Jun 22 '12 at 23:38

It is not supported prior to IE 9. You need to use something like PIE CSS. This will require you to add a htc file within your site and your css will look something like this:

.radius {
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    behavior: url(/PIE.htc);
}

score 1 · Answer 4 · answered Jun 22 '12 at 23:39

1

border-radius is a CSS3 property and IE8 doesn't support it (anything below IE8 doesn't have support for it).

However, there's a brilliant script called css3pie which adds support for IE8.

answered Jun 22 '12 at 23:39

dotty

40,405
66
150
195

How we can enable border-radius in IE?

4 Answers4