Where did you install Firefox from? Help Mozilla uncover 3rd party websites that offer problematic Firefox installation by taking part in our campaign. There will be swag, and you'll be featured in our blog if you manage to report at least 10 valid reports!

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Cuireadh an snáithe seo sa chartlann. Cuir ceist nua má tá cabhair uait.

Developer Tools - Inspector - make it always show full list of selectors in the HTML panel?

more options

In the Inspector panel in Developer Tools, HTML elements with a long list of selectors don't show all the selectors. They get reduced with a `...`. The only way I've found to show the full list of selectors is to double-click it (which puts it into "Edit as HTML" mode).

As a web developer, I find this is adding unnecessary complication and inconvenience. When picking selectors from the page, as I build out custom CSS, I don't want to have to put some HTML elements into "Edit as HTML" just to see what the full list of classes is, for example.

It most commonly occurs on the `body` elements on Wordpress sites (which tends to have a long list of `class` selectors for this element).

Is there a way to turn this feature off?

Here's the way it's displaying by default: https://ibb.co/MN93bKw

Here's the full list of selectors on that same element: https://ibb.co/Z85Sq6H

Thanks very much.

Jonathan

In the Inspector panel in Developer Tools, HTML elements with a long list of selectors don't show all the selectors. They get reduced with a `...`. The only way I've found to show the full list of selectors is to double-click it (which puts it into "Edit as HTML" mode). As a web developer, I find this is adding unnecessary complication and inconvenience. When picking selectors from the page, as I build out custom CSS, I don't want to have to put some HTML elements into "Edit as HTML" just to see what the full list of classes is, for example. It most commonly occurs on the `body` elements on Wordpress sites (which tends to have a long list of `class` selectors for this element). Is there a way to turn this feature off? Here's the way it's displaying by default: https://ibb.co/MN93bKw Here's the full list of selectors on that same element: https://ibb.co/Z85Sq6H Thanks very much. Jonathan

All Replies (1)

more options

No sooner do I ask the question ... I figure out the answer.

There's a "Truncate DOM Attributes" setting under "Inspector" in the Dev Tools settings.

https://ibb.co/30SBmL6

Problem solved.

But that brings up another issue. Is there a way to make the lines in Inspector HTML panel wrap to the panel width?