Internet explorer CSS errors?

We were working on a zen subtheme for a website when we came accross a very strange issue. Internet explorer would not render the CSS files properly. It would pick some css files, but more or less the page was scrambled. Strange issue indeed, as other browsers would display the content just fine.

After some experimentation, we realised that this is happening for both drupal 5 and 6, for internet explorer 6 and 7. Tried to disable some modules, and played around with the zen configuration, all in vain...

The solution was quite simple: It's not the modules, it's not the validation, it's not the template.php...
As simple as that, internet explorer cannot load more than 31 css files! So there, Internet Explorer did it once again. :)

Having that said, the solution is to enable the css aggregation option in admin/settings/performance -> Bandwidth optimization fieldset -> Optimize CSS files (enabled).

Save, refresh and enjoy your CSS in internet explorer.

Update: There is now a module that helps with this issue: http://drupal.org/project/ie_css_optimizer