IE bugfix - Hintergrundfarbe außerhalb fieldset mit legend

less than 1 minute read

IE bugfix - Hintergrundfarbe außerhalb fieldset mit legend thumb image

Georg Sørtun hat einen sehr guten Weg gefunden, um das Problem des Herausfließens oder background-overflow von fieldsets mit einem legend zu beheben.

Er nutzt dabei eine vererbte line-heigt, negatives margin und Standard IE Hacks. Die Lösung ist recht kurz und hat mir persönlich sehr geholfen, eine alte Barriere zu beheben und nun auch legend-Tags cross-Browser im gleichen Erscheinungsbild einzusetzen. Vielen Dank Georg!

/* 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 */;}
 
 /* IE6 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;}

 /* IE7 fix */ 
 *:first-child+html fieldset#fixed legend {
 float: left; position: relative; 
 margin-top: -.95em 
 /* equals actual line-height minus 0.35em */;}
 
 *:first-child+html p.comp {
 margin-bottom: 18px;}

Comments

Leave a comment — Edit this page on github and issue a PR for your comment please. HowTo?