|
Margine (rubnice) određuju udaljenost CSS kutije, odnosno elementa, od ostalih elemenata na stranici. Ova svojstva su duljine koje mogu biti izražene u bilo kojoj dopuštenoj mjernoj jedinici. Margine se mogu definirati ili sa sve četiri strane pojedinačno, ili skraćenim svojstvom.
margin-top
Gornja margina – udaljenost od gornjeg elementa.
margin-right
Desna margina – udaljenost od desnog elementa.
margin-bottom
Donja margina – udaljenost od donjeg elementa.
margin-left
Lijeva margina – udaljenost od lijevog elementa.
Ukoliko, primjerice, imamo element div, koji želimo odmaknuti od rubova kutije u kojoj se nalazi, možemo to napraviti koristeći margine:
div {
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
 Nula se piše bez oznake mjerne jedinice, na primjer: margin-right: 0;-
Skraćeni selektor – margin
Četiri pojedinačne margine mogu se zamijeniti skraćenim svojstvom, koje bi se tada, za prethodni slučaj, definiralo na sljedeći način.
div {
margin: 15px 70px 5px 40px;
}
 Redoslijed navođenja margina: gore, desno, dolje, lijevo.
Ukoliko želimo jednaku marginu za sve strane elementa, možemo pisati:
div {
margin: 5px;
}
|
