Note: this is one of a series of posts about the creation of the King Design web site.

Anyone who has developed a pure CSS layout with any amount of complexity is well aware of cross-browser quirks and limitations. Not all browsers have implemented CSS to the same degree or in the same way – it’s just a fact of life for web developers. While I try to use mainstream techniques as much as possible, there are times when I need to give certain browsers special treatment.

The technique I use is to have one main stylesheet that works in most modern browsers, then load additional stylesheets for problem browsers. Generally, I need to override a few classes for IE 5.5/5.0, Opera, and the occasional Safari issue.

CSS rules are applied in the order they appear in the stylesheet and the order the stylesheets are loaded. If you load your main stylesheet first, then load a browser-specific stylesheet afterward (with some of the same CSS selectors but different definitions) the definitions in the second stylesheet will override the ones defined in the main stylesheet.

Incidentally, I use the same technique to handle themes in my Tasks Pro™ and Tasks software. The base style information is loaded then, if the user has a different theme chosen, a theme stylesheet is loaded that overrides some of the base style information.

This post is part of the project: Tasks Pro™. View the project timeline for more context on this post.