Using Expression Web 3 CSS reports

Checking the compatibility and general “clenliness” of your CSS is important on any web project.  Expression web provides a number of great tools for making sure that you code is not only clean but also compatible with your target browsers.

Start by opening your site in Expression Web 3.  Select the CSS files you want to test from the file and folder list or the entire site.

You will find the CSS report by clicking on Tools>CSS reports…

About the errors tab:

Unused Styles - List class, ID, and element selectors that are defined in a CSS and not used in your web pages.
 
Undefined Classes - List class selectors that are referenced in a web page and aren’t defined in a CSS.
 
Mismatched Case - List class and ID selectors that are defined with a case that is different than the case of a reference to that style. For example, if your style sheet defines a class that is named “myclass” and a web page references “MyCLASS”, this style will appear in the report.

About the usage tab:

Class Selectors - List class selectors that are being used, the web pages that are using those styles, and the location of the style definition.
 
ID Selectors - List ID selectors that are being used, the web pages that are using those styles, and the location of the style definition.
 
Element Selectors - List element selectors that are being used, the web pages that are using those styles, and the location of the style definition.

The results of your report will show you any classes that are questionable and allow you to open the page with the offending lines lightlighted.