Is there an easy/good/proper way to dynamically load stylesheets for different browsers? There is only one proper way to load stylesheets conditionally based on the version of the browser. It is through Microsoft's proprietary "conditional comment". This is client-side side code that is interpreted by Internet Explorer (IE).
The idea is that if the version of the browser matches the conditional expression in the comment, the browser will interpret the content of the comment as XHTML code. If the version of the browser does not match the conditional expression, the browser ignores the content. You can use a conditional comment anywhere in your HTML document to conditionally insert XHTML.
The following code loads a stylesheet only in Internet Explorer version 6 or earlier.
As you know IE6 occasionally needs help to be compatible with other browsers. For this reason, using conditional comments to load stylesheets are an essential technique in Internet Explorer 6. When you use the design
patterns in my book, you won't need to use conditional comments very often, but when you need them, they are a must!
Normally I wouldn't recommend a proprietary solution, but conditional comments are an exception. They are perfectly valid XHTML, and because they are comments, they are ignored by browsers other than IE. And lastly, Microsoft officially recommends them as the ONLY proper way to insert version-specific XHTML.
Unfortunately, the W3C specifies NO official way to conditionally evaluate HTML or CSS code! This is a major oversight because all versions of all browsers have bugs that need to be worked around � even Firefox!
Because the W3C and other browser vendors do not offer a solution, some developers "hack" a solution by taking advantage of bugs in specific versions of browsers. As thousands of web developers found out when IE 7 was released, bugs get fixed and hacks no longer work.
In chapter 2 of my book, Pro CSS and HTML Design Patterns, I have a design pattern called "Conditional Stylesheet" that goes into more detail on how you can take advantage of conditional comments. For an example, check out the book's website at
http://www.cssdesignpatterns.com/Chapter%2002%20-%20HTML/Conditional%20Stylesheet/example.html. View this page in Internet Explorer and in another browser and you will see it is styled differently in Internet Explorer. You can look at the source code to see what is going on.
