Style Side Panel
Inside the Style Side Panel you can see the CSS styles, that are currently assigned to the selected node inside the HTML Panel. It also offers you similar possibilities of CSS manipulation like the CSS Panel. The difference between them is organizational. The Style Side Panel is a live view of the styles assigned to the selected node inside the HTML Panel (which can lie in different files) while the CSS Panel shows all styles of a CSS containing file.
Furthermore the Style Side Panel gives you the cascading info, meaning styles, that are overwritten by other style definitions will be shown lined-through.
|Only Show Applied Styles||
||Toggles the display of overwritten styles|
|Show User Agent CSS||
||Toggles display of user agent specific CSS styles (all styles prefixed by "-moz-")|
|Expand Shorthand Properties||
||If activated, all shorthand properties will be separated into the different styles, that make up the combined style (e. g. "margin" will be separated into "margin-top", "margin-right", "margin-bottom" and "margin-left")|
|:active||-|| Toggles display of styles defined in the |
|:hover||-|| Toggles display of styles defined in the |
For more info about tweaks available in Firebug please see the full list of preferences.