Dreamweaver CS5.5: The Missing Manual

Chapter 10. Troubleshooting CSS

Cascading Style Sheets are the most important technology in a web designer’s toolkit. Unfortunately, they’re also the source of many frustrations. As you pile style upon style in your site to transform drab HTML into beautiful web pages, you increasingly run the risk that those styles may interact in ways you don’t expect. As discussed in Chapter 8, the CSS concepts of “inheritance” and the “cascade” dictate how styles interact on a page, and those concepts have their own complicated rules. Adding to the confusion, different browsers can display CSS differently—this is especially true with the ancient, but still used, Internet Explorer 6. And even in newer browsers you can find frustrating inconsistencies in how they display CSS.

In this chapter, you’ll look at Dreamweaver’s tools for diagnosing CSS problems, as well as common problems you’ll encounter as you build the kinds of CSS layouts discussed in the previous chapter.

Analyzing CSS with Dreamweaver

Dreamweaver’s CSS tools are as good as they come—you can use them to build complex designs without ever dipping your toe into code. You can manage complex style sheets easily, and quickly add external style sheets to your pages. But building and managing styles is only one part of the CSS puzzle. You also need to analyze what the CSS is doing to the tags on your page, to see why text, for example, is purple instead of the green you specified in a style. Dreamweaver provides help for this as well.

As described ...