IE9 not recognizing border-radius - 【StackMirror】|html|css|internet-explorer-9

I cannot get IE9 to recognize my CSS border style: border-radius: 10px;. I also tried using <meta http-equiv="X-UA-Compatible" content="IE=9" />, but it just messes up my background (it cuts a piece from my background at the bottom).

<html>
<style>
.outer{
    background: url('http://v4m.mobi/php/i/images/grey_background.jpg');
    vertical-align: middle;
    text-align: center;
    width: 100%;
    height: 100%;


.inner{
margin: 0 auto;
border: 3px solid #444444;
vertical-align: middle;
-moz-border-radius: 10px; 
-webkit-border-radius: 10px;
border-radius: 10px;  /* <-- This line */
background-color: #999999;
}

.inner td{
width: 213.33px;
height: 340px;
}
</style>
<body marginwidth="0" marginheight="0" topmargin="0" leftmargin="0" style="margin: 0; 
 padding: 0; border: none">

<div class="outer">
<div style="padding-top: 5%;"></div>
<table class="inner" cellspacing="10">
    <tr>
        <td bgcolor="#ffffff">referferf$<br/>dcsdcsd</td>
    </tr>
</table>
</div>
</body>
</html>

2012-04-04 17:52
by DextrousDave

I meant, I also tried using the - meta http-equiv="X-UA-Compatible" content="IE=9" tag, it did work, but it just messes up my background layout. I could get border-radius to work earlier, but for some reason it doesn't mix with my cod - DextrousDave 2012-04-04 17:53

Your page is missing a doctype - BoltClock 2012-04-04 17:54

@DextrousDave surround inline code with backticks. http://stackoverflow.com/editing-help - Matt Ball 2012-04-04 17:55

Easier to make a JSFiddle - Francisc 2012-04-04 18:00

IE9 supports border-radius - Francisc 2012-04-04 18:00

try meta tag "IE=8" <meta http-equiv="X-UA-Compatible" content="IE=8" /> also view your output in compatibility mode(Tools->compatibility view) - m-t 2012-04-04 18:39

not sure if it will work for border radius. But there is the -ms prefix for some things. try '-ms-border-radius: 10px;' not sure it will work tho - laymanje 2012-04-04 19:35

The only solution is to use standards rendering mode - add <!doctype html> or X-UA-Compatible header. If it broke some other parts of your website, it just means you should rewrite your code because it's optimized for IE's quirks mode.

2012-04-04 17:59
by duri