IE doesn't load more than 30 stylesheets (drupal)?

I have a page that calls about 32 stylesheets. On another page, it calls < 30. In every other browser both pages look fine, but on the first page in IE (8, 7), the 开发者_运维知识库last 2 stylesheets aren't being called and it totally messes up the layout. I'm not really sure how to get around this in drupal.

EDIT: Also, I understand that having more than 30 is not that great, but that is how our site was developed originally. We have a bunch of themes and modules that add syleshets using "drupal_add_css".

I tried compressing the css by going to admin/settings/performance but the stylesheet link doesn't work because we are using a port number for our test site (http://mysite:123) and the link generated is http://mysite/public/css/random_string.css

You can use admin/settings/performance and set Optimize CSS to true. This will put out 1 css instead of 32+. If you are developing and want this on to work in IE, you need to clear the cache after changing your css. We tend to leave this off in development & only turn it on to test in IE or for production.

All best, ember

Answer to Alison's comment (too long for a comment block)

Hi AlisonC,

I've never tried using a port for a site with Drupal. I'd suggest making sure your settings.php for your site are setup correctly. There may need to be a special name for your folder (see the instructions at the top of settings.php) or you may need to check the $base_url and make sure it has the port.

If that doesn't work, there's a module for caching css while developing (http://drupal.org/project/ie_css_optimizer). I haven't used it, but it may work a little differently at least for your situation. (After typing this I noticed another user also recommended it).

I've been assuming you're still developing, and I would remove the ie css optimizer module (or at least turn it off) before going live, since it's primarily a developer helper. I think this is the limit of my knowledge. Good luck!

--Ember

This is a known limitation with IE - you cannot have more than 31 stylesheets on any given page.

References:

• http://john.albin.net/css/ie-stylesheets-not-loading

• http://social.msdn.microsoft.com/Forums/en-US/iewebdevelopment/thread/ad1b6e88-bbfa-4cc4-9e95-3889b82a7c1d/

• http://blogs.msdn.com/b/ieinternals/archive/2011/05/14/internet-explorer-stylesheet-rule-selector-import-sheet-limit-maximum.aspx

The only real solution you have is to combine your stylesheets so you have fewer individual CSS files (use Drupal's "Optimize CSS" option). But I acknowledge this may be a pain if you're trying to debug your code, etc.

In fact, it is possible to load a lot more than 31 stylesheets into IE, but for any more than 31, you need to do it via an @import line inside another CSS file. This isn't really possible in the context of a Drupal site, where each stylesheet is added by a module, and you don't really have control of how Drupal adds them to the page.

How are they being loaded? 30 individual <link href="blahblah.css"> calls? Or from other stylesheets with @import directives? Remember that if there's a syntax error, further processing of a stylesheet will fail.

http://drupal.org/project/ie_css_optimizer ...is what we use. Theme debugging is a pain with CSS optimization turned on. D7 uses the @import method this module implements to get around the issue.

There is actually a module to deal with this. I haven't used it personally but it does have 5K+ users (Drupal 6).