Padding-left

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>
<html>
   <head>
       <style>
           .padding-left { padding-left: 100px;}
      </style>
   </head>
   <body>

        <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>

   </body>
</html>

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.