Peter: Problem mit verschachtelten DIVs und FLOAT

Beitrag lesen

Hallo...

Vielleicht wißt ihr ja weiter. Um euch nicht mit seitenlangen Quelltext zu Quälen, schildere ich nur das Prinzip des Problems... also:

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:

<div style="width:400px; height:400px; border:1px solid #000">

<div style="float:left; width:100px; height:50px; border:1px solid #000">
    links
  </div>

<div style="float:right; width:50px; height:200px; border:1px solid #000">
    rechts
  </div>

</div>

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.

Sehr Erstaunliches passiert hingegen, wenn man nun noch die beiden "floats" wegnimmt: Jetzt stellen alle Browser den übergeordneten DIV wieder korrekt dar, aber die eingebetteten DIVs liegen natürlich nicht mehr nebeneinander... es ist also so, als wenn durch das "float" bei den nicht IE-Browsern quasi die Verschachtelungsordnung gesprengt wird. Mmh... soll das so laut w3c?

Wie kann ich das Problem lösen? Ach eines noch: Die Lösung mit "width:100%" in bezug auf einen weiteren übergeordneten DIV kommt aus diversen Gründen auch nicht in Frage.

Danke für die Mühe :o)