I likhet med marginaler så kan padding användas på alla taggar inom <body> </body>.

Padding, exempel

Padding förklaras enklast genom att använda ett element med en kantlinje enligt nedan.

Det här är exempel nummer 1: ett stycke utan padding.

Här är exempel 2, ett stycke med 5 pixlar padding.

Padding används alltså för att skapa ett avstånd mellan text och ytterkant medan marginaler används för att skapa avstånd mellan ytterkant och andra element.

Exempel, skillnaden mellan marginal och padding

Det här är exempel 3 med 20 pixlars bottenmarginal

Det här är exempel 4 med 10 pixlars bottenpadding

Det här är exempel 5 med 10 pixlar toppmarginal och 20 pixlars bottenpadding.

Tycker du att exempel 3, 4 och 5 ser likadana ut? Visst, för ögat så är de ju faktiskt likadana, men strukturen är helt olika, vilket du enklast märker om vi lägger på bakgrundsfärger för varje stycke enligt nedan.

Exemplen - nu med bakgrundsfärger

Det här är exempel 3 med 20 pixlars bottenmarginal

Det här är exempel 4 med 10 pixlars bottenpadding

Det här är exempel 5 med 10 pixlar toppmarginal och 20 pixlars bottenpadding.

Boxmodellen är ytterligare en förklaring av skillnaden mellan marginaler och padding.

<<< Marginaler || Boxmodellen >>>

Hitta ett billigt webbhotell för din hemsida

12:-/mån
One Webbhotell Betyg
15:-/mån
Web10 Webbhotell Betyg
36:-/mån
Host Gator Webbhotell Betyg
36:-/mån
Surftown Webbhotell Betyg

Snabbguider

Nedanför finns information för dig som vill komma igång med en hemsida på snabbast möjliga sätt - utan fokus på webbspråk.

Ett litet "gilla" är också ett sätt att hjälpa sajten. =)