HTML DOM Element clientLeft Property
- previous page clientHeight
- next page clientTop
- go up one level HTML DOM Elements Object
Definition and Usage
clientLeft
The property returns the width of the element's left border, in pixels.
clientLeft
The property does not include the element's left padding or left margin.
clientLeft
The property is read-only.
Note:style.borderLeftWidth attributeAlso returns the width of the element's left border.
See also:CSS Box Model Tutorial
See also:
Example
Example 1
Display the width of the top and left borders of myDIV:
const elmnt = document.getElementById("myDIV"); let text = "Border top width: " + elmnt.clientTop + "px<br>"; text += "Border left width: " + elmnt.clientLeft + "px";
Example 2
In this example, the text direction of "myDIV" is right-to-left, and it has a scrollbar:
let left = document.getElementById("myDIV").clientLeft;
Syntax
element.clientLeft
Return value
Type | Description |
---|---|
Number | The width of the element's left border, in pixels. |
Browser support
All browsers support element.clientLeft
:
Chrome | IE | Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
Chrome | IE | Edge | Firefox | Safari | Opera |
supported | supported | supported | supported | supported | supported |
- previous page clientHeight
- next page clientTop
- go up one level HTML DOM Elements Object