yforms: Fieldset-Rahmen im IE9 unter Legend zu sehen

[enigmatic_user]

Hallo,

in einem mit dem "Formularbaukasten" gestalteten Formular ist im IE9 (Version 9.0.8112.16421, Windows 7, 64-Bit) der Rahmen des Fieldsets unter dem Legend-Text zu sehen, sodass dieser quasi durchgestrichen wird.

Entfernt man unten in der forms.css die Zeilen

  /* all IE */
  .yform { padding-top:0\9; }
  .yform fieldset { padding:0 5px\9; padding-top:1em\9; }
  .yform legend { position:absolute\9; top:-.5em\9; *left:0\9; }
  .yform fieldset { position:relative\9; overflow:visible\9;  margin-top:1.5em\9; zoom:1; }

so ist die Anzeige im IE9 wie gewünscht (dafür aber natürlich in den älteren IE-Versionen nicht mehr besonders schick ;)).

Anschauen kann man sich das unter http://yaml-ie9-form.ccs-testarea.de/. Es handelt sich lediglich um ein YAML-Standardlayout mit yform-Formular.

Einen CSS-Hack, der nur IE6 bis IE8 anspricht (oder wahlweise nur IE9), habe ich leider bisher nicht finden können. Es wäre schön, wenn sich das trotzdem irgendwie lösen ließe - eine weitere CSS-Datei per Conditional Comment einzubinden ist irgendwie keine schöne Dauerlösung.

Sind Hintergrundfarbe des Fieldsets und des umgebenden Elements gleich, kann man sich natürlich mit einer Hintergrundfarbe für das Legend-Element behelfen; in meinem Fall, bei dem ich über dieses Problem gestolpert bin, handelt es sich aber um leicht unterschiedliche Grautöne, und dann sieht's etwas eigenartig aus, wenn man sich für einen davon entscheidet. :(

Gruß,
Jan

[djesse]

Hallo,

momentan kann ich nur 2 Wege empfehlen:

1.) Die entsprechenden CSS-Regeln in ein extra Stylesheet auslagern und dieses per Conditional Comment in den alten IEs bis Version 8 laden lassen.

2.) Modernizr oder eine vergleichbare Bibliothek einbinden und die CSS-Selektoren entsprechend anpassen.

Gruß
Dirk

[enigmatic_user]

Hallo Dirk,

vielen Dank für Deine Antwort.

momentan kann ich nur 2 Wege empfehlen:

1.) Die entsprechenden CSS-Regeln in ein extra Stylesheet auslagern und dieses per Conditional Comment in den alten IEs bis Version 8 laden lassen.

Ja, so mache ich's wie gesagt momentan auch (allerdings andersherum - ich neutralisiere die Regeln für IE >= 9).

2.) Modernizr oder eine vergleichbare Bibliothek einbinden und die CSS-Selektoren entsprechend anpassen.

Auch nicht uninteressant - vielen Dank für den Tipp! In Fällen, wo das Layout deutlich sichtbar beeinträchtigt ist, möchte ich mich allerdings lieber nicht von JavaScript abhängig machen - das ist IMHO eher etwas für zusätzliches "eye candy". ;)

Vielleicht wird ja im Laufe der Zeit noch der eine oder andere CSS-Hack für den IE9 bekannt.

Gruß,
Jan