The CSS box model is a box that surrounds every html element, which consists of margins, boders, and padding.

Margin is the outer space of an element, whereas the padding is the inner space of an element.

Height and width can be determinded with length values such as px and percentages.

The difference between a border and an outline is that an outline does not take up space, and may be non-rectangular.