CSS left Property


The left property in CSS is used to specify the horizontal position of a positioned element. It has no effect on non-positioned elements.

  • If position: absolute; or position: fixed; - the left property sets the left edge of an element to a unit to the left of the left edge of its nearest positioned ancestor.
  • If position: relative; - the left property sets the left edge of an element to a unit to the left/right of its normal position.
  • If position: sticky; - the left property behaves like its position is relative when the element is inside the viewport, and like its position is fixed when it is outside.
  • If position: static; - the left property has no effect.

CSS Syntax

left: auto|length|initial|inherit;

Property Values:

  • length: It is used to specify the length of left property. It accepts positive and negative values.
  • percentage: It specifies the width of the containing block in percentage.
  • auto:It is used to set left property to its default value.
  • initial: It is used to specify the left property to its default value.
  • inherit: It sets the left property from its parent.

Supported Browsers:

  • Firefox: 52.0, 2.0 -moz-
  • Google Chrome: 50.0, 4.0 -webkit-
  • Internet Explorer: 10.0
  • Safari: 9.0, 3.1 -webkit-
  • Opera: 37.0, 15.0 -webkit-, 11.1

Example -