An HTML Element Sizing Reference Tool

October 2025

I got tired of having to digging through the MDN docs every time I need to figure out how to get the sizes of an HTML element. So, I made this:

html-sizes.alanwsmith.com

Its got a bunch of buttons for .clientLeft, .offsetTop, .getBoundingClinetRect().x, etc... When you hit one, it give you the value and draws lines over an example element.

Took a few hours. I consider it time well spent.

-a

end of line

Endnotes

Building the tool I realized my mental model of .clientLeft and .clientTop were completely wrong. They're the size of the top and left borders of an element. Not a reference to element positioning.