Cascading Style Sheets : Filters/Hacks

Many people consider CSS filters to be very bad and will go to what I consider to be a lot of trouble to avoid using them. To me they are a necessary evil. Due to different web browsers implementing CSS slightly or, in some cases, significantly differently, there is a need to write styles that display with little to no difference in multiple browsers on multiple platforms. If all implementations were the same or if there was some way of saying "you must be this tall to ride" — for example, if all browsers with CSS support supported something like IE5+/Win's HTML Conditional Comments — it would be a different matter

I would like to stress that I am very careful about which CSS filters I use. I only use filters that validate as CSS2.x or CSS3. I also try to use filters that are fairly simple. I don't see the point in using the more complicated ones and the ones that don't validate when there are several fairly simple ones available that do validate. Before you tell me that validation isn't the ultimate goal, I would like to point out that making code validate is the best way to make sure that your code won't cause a parser to totally fail in parsing a stylesheet. (There are a few hacks that validate that cause NS4.x to ignore an entire stylesheet though. I typically use one of the @import filters to hide most if not all of my style rules from IE4 and NS4.)

Additionally, in my opinion pixel perfection is overrated. Why does it matter if different browsers render a page slightly differently as long as it doesn't look broken?

The Filters

External Related Links:


  • The oldest version of Konqueror I've tested in is 3.2.
  • I don't have access to IE4/Mac, so haven't tested these in it. If that version is mentioned, I got the information from another site.
  • When IE5.0/Win is mentioned I'm referring to IE5.01/Win.
  • When IE4/Win is mentioned I'm referring to IE4.01/Win.
Last update: 2007-01-14