Divs meereken

Bedankt! kun je ook hierachter de uitleg geven? zodat ik het in de toekomst zelf ook toe kan passen?
En is het ook mogelijk om hem zo uit te lijnen dat hij ook 5 px van de rechter blauwe balk automatisch een enter toepast?

oke, komt ie:

Marjolein schreef:

#div2 {width:700px; margin: 0; text-align: left; padding-top: 5px; float:left;}

padding moet padding-top zijn.

en als je het ook 5px naar links wil wordt div2 zo:

#div2 {width:695px; margin: 0; text-align: left; padding: 5px 0 0 5px; float:left;}

In de bovenste code had je alleen padding: 5px; staan. Dit betekend dat je 5px vanaf de bovenkant, onderkant, links en rechts je tekst uitlijnd. Dit betekend ook dat er totaal 10px (links en rechts) extra gerekend wordt bij de breedte van je div. Hierdoor werd div1 +div2 te breed voor je content dus wordt het eronder gezet. Door alleen padding-top: 5px van te maken blijft de breedte gelijk.

In het 2e voorbeeldje heb ik de padding anders ingedeeld, padding: 5px 0 0 5px; Deze 4 getallen staan voor boven, rechts, onder, links (in deze volgorde) Dus 5px vanaf de bovenkant en 5px vanaf de linkerkant. Omdat je breedte nu 5px meer is geworden heb ik dit van de width afgehaald Dus 700px-5px=695px.

Je had ook padding:5px kunnen laten staan en dan 10px van je width af kunnen halen Snap je het nog of niet?