nicht angemeldet
In einem übergeordneten DIV sollen zwei weitere DIVs eingebettet sein, und zwar so, daß der erste eingebettete DIV links und der zweite rechts im übergeordneten DIV liegt. Also dachte ich zunächst an folgende Struktur:
Das klappt auch wunderbar beim IE6, NS6.2, Opera6 und Mozilla1. Jetzt ist es für mich jedoch notwendig, eine absolute oder relative Höhenangabe im übergeordneten DIV wegzulassen, weil sich die Höhe des übergeordneten DIV an der Höhe des höchsten, eingebetteten DIV orientieren soll. Also fliegt "height:400px" raus.
Jetzt kommt nur noch der IE damit klar, die anderen Browser geben den übergeordneten DIV mit einer Höhe von Null wieder.
Nein, der IE kommt damit nicht klar, er macht es nämlich falsch.
Elemente mit gesetztem float-Attribut fallen aus dem normalen Elementfluss vollständig heraus. Schau dazu mal in den CSS-Standard zur Definition von float unter http://www.w3.org/TR/REC-CSS2/visuren.html#floats, dort sind auch Beispiele, die zeigen, warum das so sein soll.
Aber insbesondere solltest Du auch in den Abschnitt "Computing heights and margins" unter http://www.w3.org/TR/REC-CSS2/visudet.html#q17 schauen, dort heißt es:
Only children in the normal flow are taken into account (i.e.,
floating boxes and absolutely positioned boxes are ignored [..]
Daß der IE6 es falsch macht, wundert mich eigentlich ein wenig, hast Du eventuell statt des Standardmodus den Ich-würg-die-Seite-mal-so-hin-Modus aktiviert? Unter http://www.hut.fi/~hsivonen/doctype.html findest Du eine Liste mit den passenden DOCTYPE-Angaben?
Um das übergeordnete <div> auf die richtige Höhe zu bringen, kannst Du Dich eines einfachen Tricks bedienen.
Setze an's Ende dieses <div>s ein Element, bei dem clear:both gesetzt ist. Da dieses Element wegen der clear-Angabe unter alle fliegenden Bauten wandern muß, zwingt es auch automatisch das übergeordnete <div> auf die korrekte Höhe.
Gruß,
soenk.e