Práce s odsazením padding v CSS
Nějakému prvku jsme nastavili šířku
100px. V CSS to však vůbec neznamená,
že prvek bude skutečně široký
100px. Jde o to, že přidání
padding rozšiřuje prvek a ten se stává
větším, než je uvedeno ve vlastnosti width.
Podívejme se na příklad. Vytvoříme dva
bloky, kterým nastavíme šířku 100
pixelů. Zároveň druhému bloku nastavíme
padding, a prvnímu - ne. Ve výsledku
bude druhý blok větší o velikost odsazení:
<div id="elem1"></div>
<div id="elem2"></div>
#elem1 {
width: 100px;
height: 100px;
background: #f1f1f1;
margin-bottom: 20px;
}
#elem2 {
padding: 25px; /* nastavíme odsazení */
width: 100px;
height: 100px;
background: #f1f1f1;
}
:
