Utfordringen kan noen ganger være å beregne størrelsen på objekter. Om jeg lager et objekt med padding på 10px så vil denne i utgangspunktet være height + padding + border og width + padding + border.
.ramme {
width: 100px;
height: 100px;
padding: 10px;
border: 1px solid silver;
box-sizing: border-box;
}
Her har jeg lagt til box-sizing: border-box
som gjør at objektet beholder størrelsen som er angitt i høyde og bredde. Padding og border blir beregnet, men lagt til innsiden av objektet.