CSS Bologna 👨‍🏫

Padding

🏡 Home

Padding is the space between the content and the border.

Two Values and One Line

The first value is the Top and Bottom, the second value is the Left and Right.

.parent {
padding: 16px 100px;
}
Content

Four Values and One Line

Clockwise. The first value is the Top, the second value is Right, the third value is Bottom and the fourth value is Left.

.parent {
padding: 16px 200px 3px 42px;
}
Content

Individual Values

This option is often used when there is only one or two specific directions that need padding.

.parent {
padding-top: 1px;
padding-right: 50px;
padding-bottom: 50px;
padding-left: 200px;
}
Content