# Box model

Every element is a box: content, padding, border, margin.

## What is the **box model**?

The **box model** says every element is a box made of four layers: content, then padding, then border, then margin.

```css
.card {
  width: 200px;     /* content */
  padding: 16px;    /* around the content */
  border: 2px solid #333;
  margin: 12px;     /* outside the border */
}
```

Level: Novice · [More CSS terms at this level](https://www.ask-codey.com/glossary/subjects/css/novice)

Updated: September 27, 2026

Source: https://www.ask-codey.com/glossary/box-model