All HTML elements can be considered as boxes. In CSS, the term "box model" is used when talking about design and layout. The CSS box model is essentially a box that wraps around HTML elements, and it consists of: margins, borders, padding, and the actual content. The box model allows us to add a border around elements, and to define space between elements. Here is an illustration and explanation of the box model:
Explanation of the different parts:
|