HTML Problem mit Float / Backround-Color / DIV

[Belee]

Hallo Freunde

Ich hänge hier jetzt seit 2 Tagen an einem Problem fest und komm einfach nicht weiter

Folgendes Szenario:

Ich habe eine große DIV-Box, die Hintergrundfarbe ist schwarz, in dieser Box sollen zusätzlich noch 2 kleine DIV-Boxen die nebeneinander stehen, das ist mit "float" kein Problem, das eigentlich Problem ist.

Die beiden kleine DIV-Boxen strecken sich wegen dem Inhalt nach unten - was ja auch so sein soll, aber, die große Div-Box in der die beiden kleinen sind wird nicht mitgestreckt, das soll sie aber. Ich denke mal das "float" der beiden kleine ist schuld daran nur ich habe keine Lösung.
Wie bekomme ich es hin das sich die große Box mit nach unten streckt?

Danke.

<style type="text/css">
<!--
.bigbox {  
 background: #000000;
 margin: 0px auto;
 padding: 0px;
 width: 500px;
}
.left {
 background: #CCCCCC;
 margin: 0px;
 padding: 0px;
 height: 50px;
 width: 250px;
 float: left;
}
.right {
 background: #669966;
 margin: 0px;
 padding: 0px;
 height: 150px;
 width: 200px;
 float: right;
}
-->
</style>
<div class="bigbox">
<div class="left">linke kleine box</div>
<div class="right">rechte kleine box </div>
</div>

 

[flt-andre]

http://www.css-technik.de/css-examples/219_9/

Stichwort: clear

 

[Rain]

also bei IE7 streckt sich die box mit. gib mal der bigbox auch ein float:left

 

[Belee]

Ja der IE7 zeigt es so an wie gewünscht nur halt nicht die anderen Browser.

Ich habe das jetzt anders gelösst, die erste Box nach links geflotet, die zweite box nach rechts gefloted und dann ein Dummy DIV mit "clear: both" dahinter, so geht es.