HTML DOM Element offsetLeft property

Definition and usage

offsetLeft The property returns the left position relative to the parent (in pixels). This property is read-only.

The returned value includes:

  • Element's left position and margin
  • Parent's left inner padding, scrollbars, and borders

See also:CSS Box Model Tutorial

offsetParent

All block-level elements report offsets relative to the offset parent:

  • offsetTop
  • offsetLeft
  • offsetWidth
  • offsetHeight

Offset parent refers to the nearest ancestor with a non-static position.

If there is no offset parent, the offset is relative to the main text of the document.

See also:

offsetTop property

offsetWidth property

offsetHeight property

offsetParent property

clientTop property

clientLeft property

clientWidth property

clientHeight property

Example

Example 1

Get the offsetLeft position of "myDIV":

const element = document.getElementById("myDIV");
let pos = element.offsetLeft;

Try it yourself

Example 2

Get the position of "myDIV":

const element = document.getElementById("myDIV");
let pos1 = element.offsetTop;
let pos2 = element.offsetLeft;

Try it yourself

Syntax

Return the left offset position:

element.offsetLeft

Return value

Type Description
Number The left position of the element, in pixels.

Browser support

All browsers support element.offsetTop:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Support Support Support Support Support Support