Why does increasing the padding by 50px double the original shape of 100px?

This in reference to


Padding vs. Margin

It says that the default padding is already at 100px. The goal is to make the box shape 200px (horizontal) by 200px (vertical). In my head it would make sense to write it like

Padding: 100px 100px;

But the solution is actually:
Padding:50px 50px;

Why is that?

1 Like

Because it does it on both sides. 50 on the left, 50 on the right. An extra 100.

Ohhh… That makes sense!

1 Like