I’m currently working on a large-scale Drupal site which includes a large number of modules, each with their own styleshee. As already mentioned, IE6 (and below) ignore any stylesheet declarations (using style or link elements) after 30 instances. Add to this the numberous non-module stylesheets (Drupal core & IE-specific) and you’re well on your to reaching IE6s limit.

So, what are the solutions?

Aggregate & Compress CSS within Drupal

Drupal recognises the issue of an additional HTTP request required for each module stylesheet. Fortunately this feature gets around the IE6 issue by aggregating all module and core stylesheets into one instance for each stylesheet media type defined. You can access this feature by logging in as an Admin and going to Site Configuration > Performance

However this method caches CSS too, which means it’s far from ideal whilst theming development is taking place.

Unsetting stylesheets within template.php and using @import

You can disable any module stylesheets from being included by unsetting them from within template.php. First get the stylesheet array by using $css = drupal_add_css() and then go ahead and unset all stylesheets (which will then all be linked to from within just one). Your snippet will look something like this:-

# get array of stylesheets
$css = drupal_add_css();
unset($css['all']['module']['modules/system/system.css']);
unset($css['all']['module']['modules/system/defaults.css']);
unset($css['print']['theme']['themes/mytheme/print.css']);

Now you would go ahead and use the @import rule to import your stylesheets through one of your theme-level stylesheets. The issue however, still exists that if you have more than 30 being imported within a single document, stylesheets that are <30 will be ignored. To only workaround is to create a new stylesheet in this case, specifically for importing the remaining stylesheets.