Dreamweaver CS5: The Missing Manual

Checking Browser Compatibility

As if learning Dreamweaver, HTML, and CSS weren’t big enough challenges, web designers also have to contend with the fact that not all browsers display CSS the same way. What looks great in Firefox may look terrible in Internet Explorer—and vice versa. Unfortunately, a lot of CSS display problems aren’t the fault of web designers or CSS, they’re bugs in the browsers. This sad fact of browser life usually forces web designers to spend lots of time testing web pages in different browsers to identify and fix problems.

Fortunately for you, Dreamweaver includes yet another tool to help diagnose CSS problems. This one even provides advice on the best way to fix those problems, saving you many hours of testing and troubleshooting. The Check Browser Compatibility tool scans a page’s HTML and CSS, and determines if one or more browsers are likely to have trouble displaying your page. It actually checks two things: whether you included any CSS properties or values that one or more browsers won’t understand, and whether the particular combination of HTML and CSS you use might trip up a browser.

For example, neither Internet Explorer, Safari, nor Chrome supports the blink value of the CSS Decoration property (Block Properties). If you place that value in a style on a page and then use the Check Browser Compatibility tool, Dreamweaver lets you know those browsers won’t do anything with the blink setting. Eradicating these types of errors is straightforward: You either ...