CSS Box Model

Every element is a box with four layers, from the inside out: the content, the padding (space inside, around the content), the border, and the margin (space outside, between this box and others).

.box {
  padding: 20px;
  border: 2px solid #333;
  margin: 16px;
}

Increase the padding and the box grows inside; increase the margin and it pushes away from its neighbours.