The padding CSS shorthand property sets the padding area on all four sides of an element at once.
/* Apply to all four sides */
padding: 1em;
/* vertical | horizontal */
padding: 5% 10%;
/* top | horizontal | bottom */
padding: 1em 2em 2em;
/* top | right | bottom | left */
padding: 5px 1em 0 2em;
/* Global values */
padding: inherit;
padding: initial;
padding: unset;We can also use specific padding attributes for each side of the box:
padding-top: ...
padding-right: ...
padding-bottom: ...
padding-left: ...We can use percentages to specify the padding, and that percentage is related to the width of the parent element.
Source: https://developer.mozilla.org/en-US/docs/Web/CSS/padding