border-radius in fieldset doesn't work

Question

I have no more idea why this doesn't work. Here is the CSS code:

#status 
{
 width: 865px;
 margin: 0 0 0 240px;
 float: left;
}

 #status fieldset 
 {
 width: 100%;
 border:1px solid #990000 ;
 padding: 10px;
 border-radius: 5px;
}

 #status fieldset legend 
 {
 padding: 5px 15px;
 background-color:#303030;
 color:#fff;
 }

The HTML:

<div id="status"><fieldset><legend>Bla bla</legend><table class=""></table></div>

But iIused border-radius in table. Surprisingly, it works! So I don't think it is browser matter. By the way, I'm using IE9. Thank you.

Answer 1

You did not close your fieldset tag. You should instead have

<div id="status"><fieldset><legend>Bla bla</legend><table class=""></table></fieldset></div>

And if you ever need to check CSS properties for compatibility, the Mozilla Developer Network has a comprehensive list - https://developer.mozilla.org/en-US/docs/Web/CSS/Reference ).

Answer 2

please update your code with the following

#status fieldset
{width:100%;display:block;background:#ff0000;position:relative;zoom:1;border:1px solid#990000;padding:10px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;position:relative;min-height:100px;}#status fieldset legend
{padding:5px 15px;background-color:#303030;color:#fff;position:absolute;top:-16px;}