Play with Padding

Goal

• ⚡ Learn padding syntax

Padding - Individual Sides

padding-top: 50px;

padding-right: 30px;

padding-bottom: 50px;

padding-left: 80px;

Visit: https://margin-padding-demo.now.sh/

And edit element style by using chrome dev tools.

Padding - Shorthand Property

/* Apply to all four sides */

padding: 10px;

/* vertical | horizontal */

padding: 5px 10px;

/* top | horizontal | bottom */

padding: 1px 2px 2px;

/* top | right | bottom | left */

padding: 5px 1px 0 2px;

Refs

• https://developer.mozilla.org/en-US/docs/Web/CSS/padding
• https://www.w3schools.com/css/css_padding.asp