C2H5OH: Diffiziles Problem mit float:

Beitrag lesen

Die Frage ist: Darf der Inhalt von <div> D in diesem Beispiel außerhalb des Elements selbst gerendert werden? Wenn ja, wo ist das definiert? Wenn nein, warum sind sich die beiden besten Browser einig in der Darstellung? Irgendwie komme ich auf keinen grünen Zweig.

Die Antwort: Der Inhalt eines divs wird immer dann auch außerhalb des divs gerendert, wenn innerhalb des divs der Platz nicht ausreicht. Dieses wird üblicherweise mit der Anweisung 'overflow:hidden:' verhindert.

Durch die float-Anweisung für die divs A-C muß der Inhalt vom D-div rechts neben dem C-div gerendert werden, dieses ist aber aufgrund der geringen Breite des divs nicht möglich, also wird es soweit nach unten geschoben bis es unterhalb der A-,B-,C-divs erscheinen kann, das ist aber schon außerhalb des D-divs, aber bei weitem kein Problem (s.o.).

Leider reagieren nach einfügen der obigen CSS-Anweisung alle Browser anders:
MSIE reagiert garnicht und stellt alles nach wie vor falsch dar, nämlich unterhalb der Reihe der A-C divs, als ob ein clear:left; oder clear:both; das float:left; auflösen würde.
Opera stellt lediglich den Inhalt des D-divs nicht mehr da, da dieser ja außerhalb liegt, die Position des dD-divs wird nicht berührt.
Mozilla kommt als einziger Browser zu einer (zumindest intuitiv) korrekten Darstellung (wen wundert's): das D-div wir mit Inhalt rechts neben dem C-div dargestellt.

Gruß
C2H5OH