Vlastnost padding

Vlastnost padding nastavuje vnitřní odsazení elementu. Hodnotou vlastnosti jsou jakékoli jednotky pro velikosti. Ve výchozím nastavení může každý prohlížeč přidávat elementům různá odsazení. Vlastnost je zkratkou pro vlastnosti padding-top, padding-right, padding-bottom, padding-left.

Syntaxe

selektor {
	padding: hodnota;
}

Vlastnost padding přijímá 1, 2, 3 nebo 4 hodnoty, vyjmenované mezerou:

Počet	Popis
`1`	Jedna hodnota nastaví odsazení ze všech stran elementu.
`2`	První hodnota nastaví odsazení shora a zdola, a druhá - zprava a zleva.
`3`	První hodnota nastaví odsazení shora, druhá - zprava a zleva, a třetí - zdola.
`4`	První hodnota nastaví odsazení shora, druhá - zprava, třetí - zdola, a čtvrtá - zleva.

V tomto případě bude ve výchozím nastavení vnitřní odsazení nulové a text bude přitisknut k hranici bloku:

<div id="elem">
	some long text
</div>

#elem {
	padding: 0;
	width: 300px;
	border: 1px solid black;
	text-align: justify;
}

A nyní uděláme vnitřní odsazení 30px:

<div id="elem">
	some long text
</div>

#elem {
	padding: 30px;
	width: 300px;
	border: 1px solid black;
	text-align: justify;
}

Nyní bude odsazení shora a zdola 20px, a zprava a zleva - 5px:

<div id="elem">
	some long text
</div>

#elem {
	padding: 20px 5px;
	width: 300px;
	border: 1px solid black;
	text-align: justify;
}

Nyní je odsazení shora 5px, zprava - 15px, zdola - 25px, zleva - 35px:

<div id="elem">
	some long text
</div>

#elem {
	padding: 5px 15px 25px 35px;
	width: 300px;
	border: 1px solid black;
	text-align: justify;
}