Propriedade clientLeft do Elemento DOM HTML

Definição e uso

clientLeft A propriedade retorna a largura da borda esquerda do elemento, em pixels.

clientLeft A propriedade não inclui a margem interna ou externa esquerda do elemento.

clientLeft A propriedade é de leitura apenas.

Nota:Propriedade style.borderLeftWidthTambém retorna a largura da borda esquerda do elemento.

Veja também:Tutorial do modelo de caixa CSS

Veja também:

Propriedade clientTop

Propriedade clientWidth

Propriedade clientHeight

Propriedade offsetLeft

Propriedade offsetTop

Exemplo

Exemplo 1

Mostrar a largura da borda superior e esquerda do myDIV:

const elmnt = document.getElementById("myDIV");
let text = "Largura da borda superior: " + elmnt.clientTop + "px<br>";
text += "Largura da borda superior: " + elmnt.clientLeft + "px";

Experimente você mesmo

Exemplo 2

Neste exemplo, o texto "myDIV" é direcionado da direita para a esquerda e possui uma barra de rolagem:

let left = document.getElementById("myDIV").clientLeft;

Experimente você mesmo

Sintaxe

element.clientLeft

Retorno

Tipo Descrição
Número Largura da borda esquerda do elemento, em pixels.

Suporte do navegador

Todos os navegadores suportam element.clientLeft:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Suporte Suporte Suporte Suporte Suporte Suporte