Skip to content

Instantly share code, notes, and snippets.

@alexstandiford
Last active December 12, 2018 21:01
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save alexstandiford/417d6f7f7c58812fb0ae2547fa6f8d48 to your computer and use it in GitHub Desktop.
Save alexstandiford/417d6f7f7c58812fb0ae2547fa6f8d48 to your computer and use it in GitHub Desktop.
Bookmarklet to toggle red border on all elements. Good for figuring out overflow issues.
javascript:(function(){
const outline = document.querySelector('.outline-everything-with-red');
if(!outline){
style = document.createElement('style');
style.classList.add('outline-everything-with-red');
style.appendChild(document.createTextNode('* {outline: 1px solid red;}'));
document.head.appendChild(style);
console.log('The following elements appear to be wider than the document.');
[].forEach.call(
document.querySelectorAll('*'),
function(el) {
if (el.offsetWidth > docWidth) {
console.log(el);
}
}
);
}
else{
outline.remove();
}
var docWidth = document.documentElement.offsetWidth;
})()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment