complete with classes, pseudo-classes, IDs, and tag redefinitions for your documents. Edit Style: Select this option to edit a style sheet or properties for a class, pseudo-class, ID, or tag redefinition within a style sheet. The appropriate dialog opens depending on what you select from the style list. Selecting the style sheet (represented by either <stylesheetname>.css or <style>) from the style list opens the Style Sheet Editor dialog; selecting a style from the style sheet opens the CSS Rule Definition dialog. Delete CSS Rule: Click this icon to quickly remove an existing style sheet or a style from the style sheet. Now that you have an idea about how the All view for the CSS Styles panel functions, switch to the Current view by first selecting an element within the Document window that contains a style rule and then clicking the Current button. As you can see from Figure 7.9, the panel changes, exposing options for the Current view. Figure 7.9. Use the Current view to display a list of styles applied to a current selection. [View full size image] As you can see from the callouts in Figure 7.9, the following features are exposed within the Current view: Summary for Selection: This menu displays a list of style properties attached to the current selection. As you'll see later in the chapter, you can double-click a specific property to open the CSS Rule Definition dialog to make edits to the current selection. About: Clicking this button changes the pane to display information that coincides with the selected style rule. Rules: Click this button to display the cascade of rules for the particular selection. Rolling over the selection, as shown in Figure 7.10, displays the specificity of the rule as well as where the rule is defined in the page. Figure 7.10. Click the Rules button to display the cascade of rules for a particular selection. It's important to note that Dreamweaver 8 includes a new Show CSS button located just to the right of the Style menu in the Properties Inspector. Clicking this button launches the CSS Styles panel in the Current view. Now that you have an idea as to the basic premise behind CSS and the Dreamweaver panel that supports it, let's begin working with CSS in the context of our Dorknozzle project. Of course, you can download these and other project files from www.dreamweaverunleashed.com. You'll want to save the files for Chapter 7 in an easy-to-find location. I'll place mine in C:\Dorknozzle\Chapter07. For this chapter, two files (index.htm and companydirectory.htm) exist with slightly modified table and navigation structures to coincide with the examples. Creating a Style Class in an External Style Sheet As mentioned earlier in the chapter, creating classes in an external style sheet file is the ideal way to work, especially if you're dealing with a site that consists of numerous pages. This makes overall maintenance of the site simpler and much more flexible. Because you've already seen how Dreamweaver handles classes in document-wide style sheets, let's divert our attention to creating and working with classes in external style sheet files. You can create a new external style sheet file by following these steps: 1. Close the testing page you've been working with and open the index.htm file, included with the files you downloaded for this chapter. As you'll see, the page contains little to no formatting. Remember, we're going to use CSS from here on out to handle the formatting of the page.