Margin-left

CSS margin-left property is used to define how much the left margin of the element will be set. We can also give negative values.

There are some rare situations which all of width, margin-left, border, padding, the content area and margin-right are defined. When it happens, margin-left will be ignored and it will be set as if the auto value is defined.

CSS Syntax

margin-left: length | auto | initial | inherit;

Let's see an example:

<!DOCTYPE html>
<html>
   <head>
      <style>
          .left { margin-left: 25px;}
      </style>
   </head>
  <body>

    <p>This paragraph has no margin-left which is defined especially. This paragraph has no margin-left which is defined especially.</p>
    <p class="left">But you can see another text here which has a left margin defined as 25px. But you can see another text here which has a left margin defined as 25px.</p>

 </body>
</html>

Here the result is:



Property Values

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