The meaning of Paddings

Question

please help me understand the meaning and significance of PADDINGS in CSS(3)

Answer 1

To make it simple... the padding is the space INSIDE a container while the margin is the space OUTSIDE it.

As you can see in the demo below, the padding allows the black square to be in a larger container: https://code.sololearn.com/W1Zu5Oj1bcHv/?ref=app

Another important and related property is: "box-sizing", read something here: https://www.w3schools.com/cssref/css3_pr_box-sizing.asp

Try this: https://code.sololearn.com/Wrqen7nngaET/?ref=app

Answer 2

The padding is like a inset margin.
If you have a padding left of 10 pixels, the content inside that element will be displayed 10 pixels away from the left border.

Answer 3

@Mazda and @noname, thank you. very good examples there. I've tried using it. makes more sense now.

Answer 4

Прикольно но можно и улучшить