Werk met inkepings padding in CSS
Laat ons sê ons het 'n breedte van
100px aan 'n element toegeken.
In CSS beteken dit glad nie dat die
element werklik 'n breedte van
100px sal hê nie. Die saak is dat die byvoeging van
padding die element vergroot en dit word
groter as wat in die eienskap width gespesifiseer is.
Kom ons kyk na 'n voorbeeld. Laat ons twee
blokke maak, en aan beide 'n breedte van 100
pixels toeken. Maar aan die tweede blok ken ons
padding toe, en aan die eerste een nie. As gevolg
daarvan sal die tweede blok groter wees met die grootte van die inkeping:
<div id="elem1"></div>
<div id="elem2"></div>
#elem1 {
width: 100px;
height: 100px;
background: #f1f1f1;
margin-bottom: 20px;
}
#elem2 {
padding: 25px; /* stel inkepings in */
width: 100px;
height: 100px;
background: #f1f1f1;
}
:
