0

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.

nobody
  • 19,814
  • 17
  • 56
  • 77
user3072715
  • 1
  • 1
  • Have you tried to display your page in another browser ? If the error is IE9-specific, have a look at the answers to this question: http://stackoverflow.com/questions/5381446/ie9-border-radius. – Thibaud Colas Dec 06 '13 at 02:30
  • 1
    try this solution http://stackoverflow.com/questions/4584444/ie9-fieldset-rounded-corners – Dan Dec 06 '13 at 02:35

2 Answers2

0

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).

arilaan
  • 384
  • 2
  • 17
-1

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;}
Sathish RG
  • 112
  • 6