Question

I have a round corner dialog box which works fine in Firefox but the round corners are not there in IE9.

I am using the following code:

            #dialog-box {
/* css3 drop shadow */
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
/* css3 border radius */
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
background:#eee;
width: 1000px;
height:900px;
/* make sure it has the highest z-index */
position:absolute;
z-index:5000;
/* hide it by default */
display:none;
}

Answer 1

In addition to the webkit and mozilla extensions, you need to use the “standardized” border-radius property:

border-radius: 5px;

http://msdn.microsoft.com/library/ff974085.aspx

W3: http://www.w3.org/TR/css3-background/#the-border-radius