A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.
One-line version to paste in your DevTools
Use $$ if your browser aliases it:
~ 108 byte version
All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.
elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParentelem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeightelem.getClientRects(), elem.getBoundingClientRect()This document has been modified from its [original format][m1], which was written by Ning Shang ([email protected]). It has been updated and reformatted into a [Markdown][m2] document by [Woody Gilk][m3] and [republished][m4].
When working with a remote git repository which is hosted on a third-party storage server, data confidentiality sometimes becomes