Lucrul cu padding-ul în CSS
Să presupunem că am stabilit lățimea unui element la
100px. În CSS, acest lucru nu înseamnă deloc
că elementul va avea într-adevăr o lățime de
100px. Ideea este că adăugarea
padding extinde elementul și acesta devine
mai mare decât este specificat în proprietatea width.
Să ne uităm la un exemplu. Să creăm două
blocuri cărora le vom seta lățimea la 100
pixeli. În același timp, vom seta
padding pentru al doilea bloc, dar nu și pentru primul. Ca urmare,
al doilea bloc va fi mai mare cu dimensiunea padding-ului:
<div id="elem1"></div>
<div id="elem2"></div>
#elem1 {
width: 100px;
height: 100px;
background: #f1f1f1;
margin-bottom: 20px;
}
#elem2 {
padding: 25px; /* setăm padding-ul */
width: 100px;
height: 100px;
background: #f1f1f1;
}
: