Bare lige for at rydde op her og fortælle om den bedste måde at gøre dette på så ville jeg forslå at man
læser mere her om emnet "clearing".
Den gamle og ikke så gode måde at gøre dette på er via. clear:both; som bliver sat via et element som placeres efter det element som skal cleares.
En bedre løsning på dette er ved at bruge oveflow:hidden; hvis man ikke har statiske højder så løser den oftest problemet uden at skabe nye. Der kan dog opstå en fejl ved at indholdet bliver højere end div'en også bliver det overskydende skjult.
Til sidst er der den bedste men også lidt længere måde at gøre det på.
- #wrapper:after{
- content: ".";
- display:block;
- height:0;
- clear:both;
- visibility:hidden;
- }
- * html #wrapper{
- height:1%;
- } /*IE5/6*/
- *:first-child+html #wrapper{
- min-height:1px;
- }/*IE7*/
Den benytter sig af nogle "hacks" til IE5-6-7 og ellers :after pseudo elementet i de browsere som understøtter det. En lille note så ville jeg bruge overflow der hvor man kan - som er næsten altid. Men opstår der fejl så brug denne methode.
Samlet giver det dig en meget pænere markup og rykker dit clearing til stylesheetet - som er der hvor det hører til.