A padding margók kezelése CSS-ben
Tegyük fel, hogy egy elem szélességét
100px-ra állítottuk. A CSS-ben ez
egyáltalán nem azt jelenti,
hogy az elem valóban 100px széles lesz.
Az padding hozzáadása ugyanis
kitágítja az elemet, így az nagyobb lesz,
mint amit a width tulajdonságban megadtunk.
Nézzünk egy példát. Készítsünk két blokkot,
amelyek szélességét 100 pixelre állítjuk.
Ugyanakkor a második blokknak adjunk meg
padding-ot, az elsőnek viszont ne.
Ennek eredményeképpen a második blokk
a margó méretével lesz nagyobb:
<div id="elem1"></div>
<div id="elem2"></div>
#elem1 {
width: 100px;
height: 100px;
background: #f1f1f1;
margin-bottom: 20px;
}
#elem2 {
padding: 25px; /* margók beállítása */
width: 100px;
height: 100px;
background: #f1f1f1;
}
:
