padding-left

The padding-left CSS property sets the width of the padding area on the left side of an element. The padding area is the space between the element's content and its border. Unlike margins, negative values are not allowed for padding. The padding shorthand property can be used to set paddings on all four sides of an element with a single declaration.

/* <length> values */
padding-left: 0.5em;
padding-left: 0;
padding-left: 2cm;

/* <percentage> value */
padding-left: 10%;

/* Global values */
padding-left: inherit;
padding-left: initial;
padding-left: unset;

Syntax

Values

<length>

The size of the padding as a fixed value. Must be nonnegative.

<percentage>

The size of the padding as a percentage, relative to the width of the containing block. Must be nonnegative.

Formal syntax

<length> | <percentage>

Examples

.content { padding-left: 5%; }
.sidebox { padding-left: 10px; } 

Specifications

Browser compatibility

See also

• CSS Box Model
• The padding shorthand property can be used to set paddings on all four sides of an element with a single declaration: padding-top, padding-right, padding-bottom, and padding-left.