Hacks and Workarounds - Pro CSS Techniques - page 86

Using a “Standards First” Approach
The best, most headache-free way to construct layouts using CSS is to get everything working
properly in a standards-compliant browser first , and then test in other browsers and apply
hacks when needed. For the time being, the best browser to start with when putting together
your web site (no matter which operating system you use for development) is Firefox. Its ren-
dering engine is the most accurate of all modern browsers, and as an added bonus, you can
take advantage of Chris Pederick's incredibly useful (and free!) Web Developer extension
( http://chrispederick.com/work/webdeveloper/ ), which will save you countless hours and
many sleepless nights while massaging your markup and styles.

Leave IE/Win for Last, Then Hack Like a Surgeon
Once your layout is working perfectly when viewed in Firefox, it's a quick task to test in Safari
and Opera (the current versions of both should require no adjustments when following this
process), and testing in IE/Win (6/5. x ) will be nearly painless (though it's best to expect a few
problems and layout weirdness, since that's the fun of dealing with IE/Win). This process
results in fewer hacks, and those you do use can be applied with surgical precision (using
more specific selectors), with no collateral damage from cascading hacks. The example project
at the end of Chapter 14 gives a step-by-step walkthrough, showing how this approach simpli-
fies testing and bug fixing.

Wait, You Forgot a Few Browsers!
Now, if you haven't passed out from the effort of reading this topic thus far, you'll notice we've
failed to mention testing on IE/Mac (and a few similarly ancient user agents). This is because
we don't believe any time should be wasted developing for a dead browser (and by “dead” we
mean “no longer being developed”—Microsoft ceased all work on IE/Mac in late 2005, and
stopped distributing it altogether in January 2006), unless you absolutely must because of your
intended audience. Now, if you fall into that category, fear not: though your situation is unen-
viable, and likely unavoidable, there are a few hacks targeted specifically at IE/Mac later in this
chapter. If you eagerly flip ahead hoping to find hacks for Netscape Navigator 4, or hacks tar-
geting early versions of IE or Opera, you won't find them (aside from a quick tip to hide styles
from older browsers completely), and are probably reading the wrong book (you'll want one
that went out of print a few years ago, around the time those browsers should have been
mothballed).

■

Note Though CSS hacks exist for Safari, Opera, and even Firefox and Mozilla (usually to correct rendering
bugs that have been fixed in subsequent versions, or even to “fix” problems introduced by developers coding
for IE/Win), you'll have no need for them if you follow the standards-first approach (if you still need to satisfy
your curiosity, Google “css hack browsername”).