Egenskapen margin

Egenskapen margin sätter den externa marginalen för ett element. Värdet på egenskapen kan vara någon enhet för storlekar eller nyckelordet auto, som låter webbläsaren själv beräkna elementets marginal. Som standard kan varje webbläsare lägga till olika marginaler till element.

Egenskapen är en genväg för egenskaperna margin-top, margin-right, margin-bottom, margin-left.

Syntax

selektor {
	margin: värde;
}

Antal värden

Egenskapen margin accepterar 1, 2, 3 eller 4 värden, uppräknade med mellanslag:

Antal	Beskrivning
`1`	Ett värde sätter marginal på alla sidor av elementet.
`2`	Första värdet sätter marginal upptill och nedtill, och det andra - till höger och vänster.
`3`	Första värdet sätter marginal upptill, andra - till höger och vänster, och det tredje - nedtill.
`4`	Första värdet sätter marginal upptill, andra - till höger, tredje - nedtill, och det fjärde - till vänster.

Exempel

Nu ska vi ha ett block utan marginaler:

<div id="parent">
	<div id="elem"></div>
</div>

#parent {
	border: 1px solid black;
	display: inline-block;
}
#elem {
	margin: 0;
	border: 1px solid red;
	width: 100px;
	height: 100px;
}

Exempel

Och nu sätter vi marginal på 10px för blocket:

<div id="parent">
	<div id="elem"></div>
</div>

#parent {
	border: 1px solid black;
	display: inline-block;
}
#elem {
	margin: 10px;
	border: 1px solid red;
	width: 100px;
	height: 100px;
}

Exempel

Vi sätter marginal på 10px upptill och nedtill och 20px - till vänster och höger:

<div id="parent">
	<div id="elem"></div>
</div>

#parent {
	border: 1px solid black;
	display: inline-block;
}
#elem {
	margin: 10px 20px;
	border: 1px solid red;
	width: 100px;
	height: 100px;
}

Exempel

Vi sätter marginal på 5px upptill, 15px till höger, 25px nedtill och 35px till vänster:

<div id="parent">
	<div id="elem"></div>
</div>

#parent {
	border: 1px solid black;
	display: inline-block;
}
#elem {
	margin: 5px 15px 25px 35px;
	border: 1px solid red;
	width: 100px;
	height: 100px;
}

Se även

egenskapen padding,
som sätter den inre marginalen