Box model

The box model describes each element as a box made up, from the inside out, of content, padding, border (border), and margin (margin). With box-sizing: border-box, width includes padding and border, which simplifies size calculations.

Example

*, *::before, *::after { box-sizing: border-box; }
.carte { padding: 1rem; border: 1px solid #ccc; }

Related concepts

The whole glossary