Jag har stört mig otroligt länga på att jag inte hittat något bra sätt att cleara floats i en container. Har fått köra med <br style="clear:both"> men det skär i hjärtat varje gång jag skriver koden som bara är till för presentationen. Avbryter man inte en float får man denna effekt.
Så idag snubblade jag över en artikel på SitePoint som förklarde hur man gjorde. Och det var precis hur enkelt som helst!
Såhär funkar det.
<div id="outer">
<div id="inner">
<h1>Rubrik</h1>
Text 1
</div>
Text 2
</div>
#outer {
border: solid 1px red;
width: 200px;
overflow:auto;
}
#inner {
border: solid 1px blue;
float: left;
}
Resultatet blir då:
Det är alltså overflow:auto på det yttre elementet som är det magiska! Att man inte kom på det tidigare…
Nya kommentarer