fix for IE6's “background-overflow on fieldset with legend” bug

flawed in IE6.

Credit Card Information



corrected in IE6.

Credit Card Information



how to:

actual styles for this demo

 /* basic fieldset styling */ 
 fieldset {
 background: #cde; 
 width: 300px; 
 position: relative; 
 line-height: 1.5;}

 fieldset legend {
 line-height: 1.3 
 /* note this line-height value */;}
 
 /* IE-win fix */
 * html fieldset#fixed legend {
 float: left; position: 
 relative; margin-top: -.95em 
 /* equals actual line-height minus 0.35em */;}
 
 * html p.comp {
 margin-bottom: 18px;}

addendum

I've had this simple test/demo in my local files for a long time – see date below – but haven't bothered to turn it into a proper page and launch it until the summer 2007. The reason for presenting it at all is that some still seem to have problems with this IE6 bug, and may be in need of a documented fix. You're welcome to it.

author: Georg Sørtun
date: 18.sep.2005
last rev: 07.jul.2007