MARGIN
Sve što smo naveli za padding, važi i za prostor predstavljen na slici kao margin.
Sintaksna razlika je u tome što ćete svuda umesto reči padding pisati reč margin, sve ostalo ostaje isto.
Ako pogledamo primer iznad, sintaksno, to bi izgledalo ovako:
div{margin-top: 5px;}
div{margin-right: 8px;}
div{margin-bottom: 6px;}
div{margin-left: 4px;}
ili zbirno:
div{margin:5px 8px 6px 4px;}
Ipak, postoje značajne razlike izmedju padding i margin. To su:
- Padding NE može imati negativnu vrednost dok margin može.
- Padding sadrži pozadinsku boju ili sliku elementa dok je margin transparentan
- Margin udaljava element od drugih elemenata u dokumentu dok padding definiše udaljenost sadržaja od unutrašnje ivice elementa.
Pogledajmo primer
<!DOCTYPE html>
<html>
<head>
<meta charset=”utf-8″>
<title>Pozicioniranje elemenata kreiranjem DIV-ova</title>
<style>
img{padding:10px;margin:10px;border:5px solid red;background-color:yellow;}
div{margin:0px;padding:0px;border:1px solid black;width:151px;height:117px;}
</style>
</head>
<body>
<div>
<img src=”kafe1.jpg”>
</div>
</body>
</html>
