[css] Geneste divs 'heffen' eigenschappen op

[Neobender]

Ik ben bezig met een site en nu wil ik op de openingspagina een stukje tekst in 2 kolommen verdelen.
Maar daarom heen wil ik een vak dat mooi de rest van de layout volgt en een witte bg heeft en blauwe borders met daarin dus de 2 divs met tekst. Maar als ik zodra ik deze 2 divs de opdracht geeft om rechts en links te floaten, heffen ze alle eigenschappen op die ik heb toegekend aan de 'parent-div'.
Ineens wordt de achtergrond transparent en zijn ook de borders weg.

HTML:

<div class="content">
    <div class="text" style="width: 400px; float: left;">
        <h2>Welkom</h2>
        <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."       
        </p>
    </div>
        
    <div class="text" style="float: right; width: 200px;">
        <h2>Nieuws</h2>
        <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."       
        </p>
    </div>
</div>

En de css:

Cascading Stylesheet:

.content {
background-color: #FFFFFF;
width: 100%;
border: 2px solid #00809b;
}

.text p { 
    font-size: 10px;
    font-family: Geneva, Arial, Helvetica, sans-serif;
    margin: 0px;
    text-align: justify;
    color: #000000;
}
.text h2 {
    font-size: 12px;
    font-family: Geneva, Arial, Helvetica, sans-serif;
    margin: 0px;
    color: #000000;
}

[crisp]

Je haalt je div's uit de float, daardoor heeft je content-div geen inhoud meer en dus geen hoogte

Makkelijkste oplossing is je content-div een overflow: auto of hidden te geven zodat je 'auto-clearing' krijgt.

[Neobender]

Geweldig het werkt
Bedankt (Y).

[Alex)]

"Crisp, hoe doe je dat toch?"

"Heel simpel, ik ben Crisp, van Tweakers Financieringen Design"

Koortje: "Crisp van Tweakers"
Zware stem: "DESIGN"


[/het is 5 uur en ik word een beetje melig-modus]