Border Radius for IE8

Question

I have a problem with border radius on IE8, till now I used pie.js but I don't recommend this js library because is buggy. If you have a small site with not many html pages, it is more than ok to use that library, but if you have a heavy application in which many different frameworks are used, then is impossible to use that. Same behavior for CurvyCorners or other mega libraries.

So if anyone can help me with a small jQuery or javascript plugin to do just border-radius on IE 8 I'll be grateful for life.

Answer 1

Try this:

requires:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://malsup.github.com/jquery.corner.js"></script>

Javascript:

$('.box').corner();

HTML:

<div class="box">Hello</div>

CSS:

box{
  width:150px;
  height:28px;
  padding:10px;
}

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

Answer 2

Short of using the libraries that you described in your question, I don't think you can do curved corners in IE8.

If you really wanted them, you could probably use an image to give the curved corner effect, at the cost of increased bandwidth and messy code.

Answer 3

According to Microsoft:

Other Rounded Corners Solutions

We would like to point out the abundance of alternate solutions available on the Web. In addition to individual rounded corners solutions, there are also sites with frequently updated lists of rounded corners solutions that are compatible with multiple versions of Internet Explorer and other browsers.

Listed here are a few of our favorite sites for aggregated rounded corners solutions. They are presented in no particular order, and the inclusion of any link does not imply endorsement by Microsoft of the site.

• CSS-Discuss Wiki, RoundedCorners: http://css-discuss.incutio.com/?page=RoundedCorners

• SmileyCat, CSS Rounded Corners "Roundup": http://www.smileycat.com/miaow/archives/000044.php

• CSS Juice, 25 Rounded Corners Techniques with CSS: http://www.cssjuice.com/25-rounded-corners- techniques-with-css/

Answer 4

Check out this post: http://www.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/

It covers specifically rounded corners and box shadow in IE7/8.

and also below with so many examples

http://blue-anvil.com/jquerycurvycorners/test.html