How do I hide the annoying yellow box that appears under html fields when I hover over elements in the Chrome "Developer Tools" elements panel - it's driving me nuts as I can't see the bottom of my labels etc...
Inspect Element Components The orange below visually displays this element's margin-bottom property, and in this case indicates there are no side or top margins and no padding properties by the lack of being displayed.
We can hide an element by inspecting it with Chrome DevTools, right-clicking the element under the Elements tab, and choosing the Hide element menu from the context menu. If you're a fan of using the shortcut, then pressing the <kbd>h</kbd> key has the same effect.
Start Google Chrome with the “—disable-dev-tools” command line switch to prevent the “Developer Tools” feature from running.
The colors are the following: Orange is Margin. Yellow is Border. Green is Padding.
From the posted bug: "https://code.google.com/p/chromium/issues/detail?id=282493". If you hold keyboard Control (Ctrl) key before hovering the element (or command on a mac) the tooltip won't show. Not the ideal solution but it works as long as you know about it
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With