Float-bokse overskrider parent

Hej derude

Jeg har et problem med CSS-koden float. Kodestykket ser såldes ud:

    <div class="content">
        <div class="contentcenter">
           
            <div style="widht:100%; background-color:blue; text-align:left;">
                <div style="float:left; height:400px; background-color:red;">Hej</div>
                Indhold
            </div>
       
        </div>
    </div>
(findes på http://www.pandinetworks.com)

Jeg vil gerne lave 2 floats inde i den blå boks som skal ligge side om side, men fordi jeg har haft problemer med det før ville jeg lige prøve at se hvad der skete hvis jeg ikke definerede en højde på den blå og satte højden til 400 på den røde, og som jeg huskede så overskrider den røde den blå boks istedet for at udvide den, er der nogen der kan hjælpe mig med at forstå hvorfor det sker, og eventuelt give en løsning på hvordan man får den blå boks til at følge med når den røde er højere end den blå samtidig med at man kan bruge float?