Hintergrundfehler in div Element bei IE 5-7

[molily]

Hallo,

ich weiß nicht ganz, was du als korrekte Umsetzung dieses CSS ansiehst. Als Maßstab nehme ich mal die standardkonformen Firefox und IE 8. Da fließt der Text um die floatende Box herum.

Im IE 7 ist das nicht der Fall, weil deine Angabe min-height für #text den Modus »hasLayout« auslöst. Das ist eine IE-interne Eigenschaft von Elementen, die das Rendering bestimmt. Eine Wirkung davon ist, dass das Element sich nicht mit floatenden Elementen überlappt. Ein »Herumfließen« wird daher im IE 7 verhindert, das Element #text liegt komplett neben #neu.

Was du z.B. tun könntest:

• #neu in #text verschachteln
• min-height weglassen und nur für neuere Browser setzen. (Das wird schwierig, einen entsprechenden »Filter« zu finden, der den IE 7 ausschließt.)

Für den IE 6 musst du ein wenig tricksen. Ich habe einfach mal position:relative vergeben (damit lassen sich solche Probleme üblicherweise fixen) und schon tauchte das Element auf. Der IE 6 lässt sich auch einfacher ansprechen:

* html #neu { position: relative; }

IE 5.x kannst du getrost außen vor halten. Wahrscheinlich ist es sogar zuviel Aufwand, bei einer kleineren Site noch für den IE 6 zu optimieren. Dessen Nutzerzahlen sinken rapide.

Mathias