«   Previous tip Next tip   »

Chrome DevTools: See affected nodes and matching selectors with long hover

Last updated: 19th July 2020
See affected nodes and matching selectors with long hover

In the Styles Pane within the Elements Panel, you can long-hover a CSS property to highlight all nodes which are affected by that a property. This applies for CSS properties which affects an elements box model, such as margin or padding.

💡️   As a bonus tip, if you long-hover a CSS selector within the Styles Pane, all elements matching that selector are highlighted on the page.

«   Previous tip Next tip   »

Sign up to receive a developer tip, in the form of a gif, in your inbox each week