Odmaci

 

Odmak je udaljenost od granice CSS kutije do sadržaja. Slično kao i kod margina, postoje četiri odmaka i skraćeno svojstvo. Ukoliko nije eksplicitno definirana, predefinirana vrijednost odmaka je 0.

padding-top

Odmak od gornje granice.

padding-right

Odmak od desne granice.

padding-bottom

Odmak od donje granice.

padding-left

Odmak od lijeve granice.

 

Razmotrimo opet element div iz prethodne lekcije, pa mu uz postojeće margine dodajmo i odmak:

div {
padding-top: 15px;
padding-right: 65px;
padding-bottom: 35px;
padding-left: 65px;

margin-top: 15px;
margin-right: 70px;
margin-bottom: 5px;
margin-left: 40px;
border: 1px solid #000;
background-color: #99CCFF;
}
<div>Lorem ipsum dolor sit amet</div>
Lorem ipsum dolor sit amet

Vidljivo je da tekst zbog odmaka prelazi u nov red, ali se boja pozadine, bez obzira na odmak, proteže do granice elementa.

Skraćeni selektor – padding

Kao i kod margina, i ovdje se može definirati odmak na drugi način:

div {
padding:5px 10px 15px 20px;
}

Odnosno, ukoliko je odmak sa svih strana jednak:

div {
padding:5px;
}
CARNet
Accessibility

Boja pozadine

Font

Veličina fonta

1

Boja teksta