Element dimensions

All HTML elements have six property pairs that allow you to read out their dimensions. This page tests and explains these property pairs.

This is the test DIV.
It has these styles:

width: 200px;
height: 200px;
border: 10px solid #AF0078;
padding: 5px;
overflow: auto;

Its total visible width and height are therefore 230 pixels (200 width + 10 padding + 20 border).

This is the test DIV.
This is the test DIV.
This is the test DIV.
This is the test DIV.
This is the test DIV.
This is the test DIV.
This is the test DIV.
This is the test DIV.
This is the test DIV.
This is the test DIV.

clientLeft clientTop clientWidth clientHeight offsetWidth offsetHeight offsetLeft offsetTop offsetParent scrollLeft scrollTop scrollWidth scrollHeight