I am designing a webshop which has a table layout.

My problem is that i have created rounded corners using css, and it works fine in all other browsers than IE.

Normally when i design, using divs as layout base, the css rounded corners display just fine, also in IE.

Does IE not support rounded corners for tables using CSS3?

I have put this meta tag in the top of the page, as i have read it could help - but no luck:

<meta http-equiv="X-UA-Compatible" content="IE=9" />

Anyone had this problem, and maybe a solution?

regards, jan

Example:

<style type="text/css">
.rounded_corners{border-radius:10px;}
</style>
<table>
<tr>
<td class="rounded_corners">blah blah</td>
</tr>
</table>

Recommended Answers

All 3 Replies

Ie is known for his many bugs those includ the orunded corners there are some work a rounds like pie.js pie.htc or you can use a hack like -moz-border-radius: 10px;
border-radius:10px desadvantaje is that w3school will not validate css3 for now and filters.
If I were you I would try to use pie.
Hope that helps.

Easy solution - drop the table based layout, something from the last century, and go back to using divs like everyone else does.

Echoing drjohn's recommendation - if it's not tabular data, don't use tables unless you absolutely have to.

As for w3c validations - sometimes you just have to choose your battles. If everything in your css validates except for the vendor specific stuff you need, then don't sweat it.

And MSIE is notorious for not supporting things like rounded corners. IE9 is better, but there's still a lot of things missing.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.