HTML DOM Element clientLeft
Example
Display the width of myDIV's top and left border:
const elmnt = document.getElementById("myDIV");
let text = "Border top width: " + elmnt.clientTop + "px<br>";
text += "Border left width: " + elmnt.clientLeft + "px";
Try it Yourself »
More examples below.
Definition and Usage
The clientLeft
property returns the width of the element's left border, in pixels.
The clientLeft
property does not include the element's left padding or left margin.
The clientLeft
property is read-only.
Note
The style.borderLeftWidth Property also returns the width of an element's left border.
Tutorial:
See Also:
Syntax
element.clientLeft
Return Value
Type | Description |
Number | The width of the element's left border, in pixels. |
More Examples
In this example, the text direction of "myDIV" is right-to-left, and it has a scrollbar:
let left = document.getElementById("myDIV").clientLeft;
Try it Yourself »
Browser Support
element.clientLeft
is supported in all browsers:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes | Yes |