Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

Is it possible to get rounded corners in IE8 using only CSS? If so, how?

share|improve this question

closed as off topic by John Conde Feb 2 '11 at 12:50

Questions on Webmasters Stack Exchange are expected to relate to webmastering within the scope defined by the community. Consider editing the question or leaving comments for improvement if you believe the question can be reworded to fit within the scope. Read more about reopening questions here.If this question can be reworded to fit the rules in the help center, please edit the question.

    
HTML/CSS questions are a better fit on Doctype –  John Conde Feb 2 '11 at 12:50
add comment

4 Answers

I know of one simple solution to use; the JavaScript JQuery plugin JQuery Corners.

All you have to do is link JQuery and the plugin using an external script reference, then add this code:

$("[SELECTOR]").corner();

JQuery

JQuery How-To (In case you don't know)

JQuery Corners demo

share|improve this answer
add comment

Unfortunately, it's not possible using only CSS.

Here's an article by Microsoft about the very topic where they offer links to other solutions.

From the article:

While the W3C has specified the border-radius properties in its latest CSS3 working draft, Microsoft has not implemented the border-radius properties in Internet Explorer 8.

Microsoft is committed to providing a browser that accurately supports Web standards. In Internet Explorer 8, we shipped several features from HTML5 and CSS3. Our primary goal was implementing CSS 2.1 (a specification that has reached final candidate stage) completely and correctly before moving on to specifications that are still in development and may change.

share|improve this answer
add comment

Unfortunately as well, IE9 doesn't support half of the features of CSS3.

There is an alternatively something called CSS3 PIE, but I have tried many times to get this to work but haven't been successful. This isn't to say it doesn't work, because it does, but I don't know how to get it to work.

share|improve this answer
add comment

I'm pretty sure the CSS property:

-moz-border-radius:10px;

works in IE8, else have a look at this post: http://www.htmlremix.com/css/curved-corner-border-radius-cross-browser

share|improve this answer
1  
That CSS property doesn't, as it's only recognised by Firefox. Hence the -moz tag. –  mickburkejnr Feb 2 '11 at 14:10
add comment