Selectors Side Panel

From FirebugWiki
Revision as of 11:07, 4 July 2013 by Sebastianz (Talk | contribs) (Updated info in regard of the changes for 1.12)

Jump to: navigation, search
File:Selectors Side Panel.png
Selectors side panel

The Selectors side panel lets you try out CSS selectors and lists all matching elements on the page. Selectors can be entered via the Try a selector... field or by right-clicking a selector inside the CSS Panel and choosing Get Matching Elements from the context menu. Doing so will list all elements that match the entered selector.

You can create several selector trials, which are displayed as foldable groups showing the entered CSS selector in the header and listing the matching elements below. These groups are persisted on page reloads and updated dynamically as elements on the page are added, removed or changed. To remove a selector trial there's a button at the right side of its header.

Clicking a matching element directs you to the HTML Panel and select the element there.

Context Menu

The context menu for the matching elements is the same as for the HTML elements inside the HTML panel.