CSS left attribute

Definition and usage

The left property specifies the left edge of the element. This property defines the offset between the left outer margin boundary of the positioned element and the left boundary of the containing block.

Note:If the value of the "position" attribute is "static", setting the "left" attribute will have no effect.

Description

For static elements, it is auto; for length values, it is the corresponding absolute length; for percentage values, it is the specified value; otherwise, it is auto.

For relatively defined elements, the calculated value of left is always equal to right.

See also:

CSS Tutorial:CSS Positioning

HTML DOM Reference Manual:left property

Example

Set the left edge of the image to 100 pixels to the right of the left edge of the containing element:

img
  {
  position:absolute;
  left:100px;
  }

Try it yourself

CSS syntax

left: auto|length|initial|inherit;

Attribute value

Value Description
auto Default value. The position of the left edge is calculated by the browser.
% Set the left position of the element as a percentage of the containing element. Negative values can be used.
length Set the left position of the element using units such as px, cm, etc. Negative values can be used.
inherit Specifies that the left property value should be inherited from the parent element.

Technical details

Default value: auto
Inheritance: no
Version: CSS2
JavaScript syntax: object.style.left="100px"

More examples

Set the left edge of an image using a fixed value
This example demonstrates how to set the left edge of an image using a fixed value.
Set the left edge of an image using percentage
This example demonstrates how to set the left edge of an image using percentage values.

Browser support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome IE / Edge Firefox Safari Opera
1.0 5.5 1.0 1.0 5.0