In lieu of CSS hackery like this (from my previous stylesheet):
body {
font-size: 93%; /* for IE/Win */
}
html>body {
font-size: 100%; /* for Opera */
}
head:first-child+body {
font-size: 93%; /* for Mozilla, IE/Mac */
}
I have decided to handle browser differences with mod_rewrite. Each page links to two stylesheets: mu.css and om.css. Everybody gets mu.css, and the bulk of my styles are defined there. But for browser-specific workarounds, om.css gets redirected based on rules I set up in my .htaccess file:
RewriteEngine on
RewriteCond %{HTTP_USER_AGENT} Chimera
RewriteRule om.css chimera.css [L]
RewriteCond %{HTTP_USER_AGENT} Safari
RewriteRule om.css safari.css [L]
RewriteCond %{HTTP_USER_AGENT} Omni
RewriteRule om.css omniweb.css [L]
RewriteCond %{HTTP_USER_AGENT} iCab
RewriteRule om.css icab.css [L]
RewriteCond %{HTTP_USER_AGENT} “Opera 6″
RewriteRule om.css opera6.css [L]
RewriteCond %{HTTP_USER_AGENT} Gecko
RewriteRule om.css mozilla.css [L]
RewriteCond %{HTTP_USER_AGENT} “MSIE 5″
RewriteCond %{HTTP_USER_AGENT} “Win”
RewriteRule om.css ie5win.css [L]
RewriteCond %{HTTP_USER_AGENT} “MSIE 6″
RewriteCond %{HTTP_USER_AGENT} “Win”
RewriteRule om.css ie6win.css [L]
RewriteCond %{HTTP_USER_AGENT} “MSIE”
RewriteCond %{HTTP_USER_AGENT} “Mac”
RewriteRule om.css ie5mac.css [L]
This allows me, for instance, to specify pixels in my base stylesheet, but override them with percentages in my IE/Win-specific stylesheets (since IE/Win can’t resize fonts specified in pixels, but every other browser on earth can). And it’s not really as complicated as it looks; most of the browser-specific stylesheets are empty.
I am aware that this is a complete reversal from the position I took last week, when I claimed that CSS hackery was the lesser of two evils (the other being browser sniffing).
To (mis)quote Mae West: Whenever I’m caught between two evils, I take the one I’ve never tried.
And so it goes.
