CSS-Problem mit verschatelten DIVs

[Vermeer]

Hi,
anscheinend schaffe ich es nicht divs richtig zu verschachteln:
hier mein Beispiel:
<div style="width: 710px; background-color: Aqua;">
<div style="border:1px solid #000000; -moz-border-radius:10px; background-color: #f0f0f0; width:500px; float: left;">sdfdsfdfsdfsdfsdfd<br>sdaffasff<br>sdfsddfsdfs<br>asdsadd</div>

<div style="border:1px solid #000000; -moz-border-radius:10px; background-color: #f0f0f0; width:180px; float: right;">bluberdiblub</div>
</div>
<br><br>FOOTER

Eigentlich sollte das Wort "FOOTER" links unten mit einer Zeile abstand sthene, und die beiden anderen (im Firefox abgerundeten) divs sollten in einem großen, aqua-farbenem div stehen.
Aber der Text "Footer" kommt gleich unterhalb des dritten divs, so als würde sich dieser Text noch innerhalb des zweiten divs befinden...

Was mache ich falsch? Ich finde den Fehler einfach nicht.

Gruß
Vermeer

[Philipp Stephani]

Hallo,
du darfst nur einem der divs eine float-Eigenschaft verpassen, nämlich dem kleineren. So funktioniert es:

<div style="border:1px solid #000000; -moz-border-radius:10px; background-color: #f0f0f0; width:180px; float: right;">bluberdiblub</div>
<div style="border:1px solid #000000; -moz-border-radius:10px; background-color: #f0f0f0; width:500px;">sdfdsfdfsdfsdfsdfd<br/>sdaffasff<br/>sdfsddfsdfs<br/>asdsadd</div>

Schau dir auch mal diesen SELFHTML-Artikel an.