Monthly Archives: December 2017

Find HTML elements which are overflowing the body

That pesky horizontal scrollbar is far too common a site (get it?) across the net (nobody gets my 90s web humour). Find which elements overflow the body (or any other element) of your page by pasting this in your developer console:

var findOverflowingElements = function(node) {
    var nodes = [],
	parentW = node.getBoundingClientRect().width,
    processNode = function(node) {
		if (!(node instanceof HTMLElement)) return;
        if (node.getBoundingClientRect().width > parentW) nodes.push(node);
        for (var child = node.firstChild; child != null; child = child.nextSibling) {   
            processNode(child);
        }
    };
    processNode(node);
    return nodes;
}
findOverflowingElements(document.body);