Search code examples
javascriptcssinternet-explorerconditional-comments

Using IE conditional comments to include CSS or JavaScript files results in more http requests

A web designer has created pages for us with IE-specific comments. Consequently, certain stylesheets are only included if the user is using a specific version of IE:

<!--[if lt IE 7]>
<link type="text/css" rel="stylesheet" href="/styles/ie6-fixes.css" media="screen"  />
<![endif]-->

The same technique has been used for JavaScript files. Unfortunately, this results in more HTTP requests for IE users, so the perceived page load time is slower. Generally, my practice is to combine all CSS in a single file, and all JS in a single file.

Is there a way that these IE-specific comments within CSS and/or JS files themselves? Or is there a way I can simulate this functionality?

Solution

  • For CSS you can use IE-specific comments to surround the document content in an element of the form 

    <div id="IE6">

    This could allow you to implement IE6 CSS fixes by prepending selectors with "#IE6 ".

    For more details see http://www.positioniseverything.net/articles/cc-plus.html

    JScript also has conditional compilation which may help you consolidate your JS files into one. See http://msdn.microsoft.com/en-us/library/ahx1z4fs(VS.80).aspx