Internet Explorer implements a proprietary technology called Conditional Comments. While web developers frown upon technologies that aren't cross-browser supported, many CSS developers have found Conditional Comments very useful. They can have cleaner CSS in their normal stylesheets and can fix the broken rendering in IE by placing IE-only CSS inside conditional comments; this technique is even recommended by Microsoft.
Without this module, the only way to have IE conditional stylesheets was to add 35 lines of code (more if you want to add more than one stylesheet) in four horribly-difficult-to-remember function calls to your theme's template.php. Blech. Who wants that?
This module allows themes to easily add conditional stylesheets to the theme's .info file.
; Set the conditional stylesheets that are processed by IE.
stylesheets-conditional[lt IE 7][all][] = ie6-and-below.css
stylesheets-conditional[IE 9][all][] = ie9.css
stylesheets-conditional[IE][print][] = ie-print.cssNote: The above syntax is for Drupal 7 themes. See below for Drupal 6 syntax.
Placing the above lines in your theme's .info file will automatically append the following HTML code after your existing stylesheets in the <head> of your website:
<!--[if lt IE 7]>
<link type="text/css" rel="stylesheet" media="all" href="ie6-and-below.css" />
<![endif]-->
<!--[if IE 9]>
<link type="text/css" rel="stylesheet" media="all" href="ie9.css" />
<![endif]-->
<!--[if IE]>
<link type="text/css" rel="stylesheet" media="print" href="ie-print.css" />
<![endif]-->More information about the .info file syntax used by this module can be found in the documentation. In addition, more information about Conditional Comments is available on Microsoft’s website.
Note that all versions of IE limit the number of stylesheet files to 31. In Drupal 6, this will cause problems if you have a large number of stylesheets; consider aggregating them in the performance settings page, or installing the IE CSS Optimizer module.
What themes make use of the Conditional Stylesheets module?
The following themes have conditional stylesheets included their .info file and make use of the functionality of this module.
- Zen
- Layout Studio
- Tendu
- Hopefully more to come…
But all themes should be compatible with this module if you manually add lines to their .info file.
Drupal 6 version
The above information is about the Drupal 7 version, for information about the Drupal 6 version, please read the online documentation.
About the “logo”
Its a parody of the IE6 logo with our friendly Druplicon.
Project Information
- Maintenance status: Actively maintained
- Development status: Under active development
- Module categories: Theme Enhancements
- Reported installs: 8510 sites currently report using this module. View usage statistics.
- Last modified: November 17, 2011
