Group 42

Note: It's worth reading through the comments on this post, this technique isn't as useful as it first appears - Dale, Feb 18/09

Browser specific CSS is sometimes unavoidable. The common method for handling it is conditional stylesheet includes. The SitePoint article, How to Use Conditional Comments for Better CSS, which credits Paul Hammond's post, Conditional classnames, discusses a technique for doing browser specific CSS without different stylesheets. The ability to consolidate related CSS instead spreading it across multiple stylesheets seems like a great idea.

This method takes on further elegance with Drupal because the ugly conditional statements are not required to apply the classname to the body tag. The browser specific classname can be generated in the template code.

Although I'd stashed the idea away in my "cool file" I hadn't considered writing about it until I'd read Squiggy Rubio's article, A Review of Drupal 6 Starter Themes. Co-maintainer of the Basic Theme, Steve Krueger, commented that Basic uses this technique, describing it as "one 'smaller' feature that wasn’t mentioned that I think deserves its 15 minutes." Squiggy Rubio agreed, and so do I!