The padding-left CSS property of an element sets the padding space on the left of an element.

We can't give negative values.

This property has no effect on inline elements, like <span>.

CSS Syntax

padding-left: length | initial | inherit;

Let's see an example:

<!DOCTYPE html>
           .padding-left { padding-left: 100px;}

        <p> Here we didn't set any padding.</p>
        <p class="padding-left"> You can see that we defined a 100px padding left for this text.</p>


Property Values

Value Descriptions
length It sets the left padding in px, pt, cm, etc. Its default value is 0px.
% It sets left padding in percent of the width of the containing element.
initial It makes the property use its default value.
inherit It inherits the property from its parents element.

Related articles