tags:

views:

1419

answers:

1

I use this piece of CSS code for fieldset in my ASP.net

.important 
{
    border:1px solid #33CC00;
    padding:8px 10px 7px 20px;
}

.important 
{
    -moz-border-radius-bottomleft:4px;
    -moz-border-radius-bottomright:4px;
    -moz-border-radius-topleft:4px;
    -moz-border-radius-topright:4px;
    background:#FFFFFF none repeat scroll 0 0;
}

.important legend 
{
    -moz-border-radius-bottomleft:4px;
    -moz-border-radius-bottomright:4px;
    -moz-border-radius-topleft:4px;
    -moz-border-radius-topright:4px;
    -x-system-font:none;
    background:#F3FFF3 none repeat scroll 0 0;
    border:1px solid #33CC00;
    color:#33AA00;
    font-family:"Trebuchet MS";
    font-size:1.2em;
    font-size-adjust:none;
    font-stretch:normal;
    font-style:normal;
    font-variant:normal;
    font-weight:normal;
    line-height:normal;
    padding:1px 15px;
}

It look fine on FireFox but it look like crap on IE7 and IE8. I'm not sure how i can fix this on IE. Does anyone know any website dealing with CSS hack in IE or should i just give up because life is too short to waste on cross browser compatibility.

+3  A: 

-moz-border-radius- is a Mozilla specific selector which IE will ignore. border-radius is the equivalent CSS3 selector, but IE almost certainly won't support it (Firefox 3 does, but I seem to remember there are problems with either the standard or the implementation)

Stuart Dunkeld
FYI - IE actually renders a rounded edge for Fieldset by default
Rob Allen