Html Fieldset Rounded Corners - Updated (1/18/2010)

I don't usually prefer anything about Internet Explorer. However, IE's default presentation for the Html fieldset tag just looks nicer. Firefox, on the otherhand, defaults to an ugly square box presentation. So, to try to get Firefox to look more like IE (something I never thought that I would say) ...

fieldset { 
   -moz-border-radius-bottomleft: 7px;
   -moz-border-radius-bottomright: 7px;
   -moz-border-radius-topleft: 5px;
   -moz-border-radius-topright: 7px;
   -webkit-border-radius: 7px;
   border-radius: 3px;
}

This works for IE, Firefox, and now Chrome. It still doesn't look "nice" in Safari.

If you absolutely must have rounded corners: http://www.spiffycorners.com. However, I caution you against the author's approach because it requires too much Html for an effect that will be cleanly implemented in CSS3. Again, this is only a nice to have.

Example:

Title

contents