Internet Explorer’s annoying 30 CSS files limit bug
Internet Explorer is a lousy browser family, and it has some of the most annoying bugs possible.
Took me a while to figure out why websites were breaking in some pages, till I was finally able to figure out that Internet Explorer has a bug where it can handle only pages with under 30 CSS files. Anything above that and the page would go dead.
Don’t believe me? check Microsoft’s “All style tags after the first 30 style tags on an HTML page are not applied in Internet Explorer”
All style tags after the first 30 style tags on an HTML page are not applied. Occasionally, you may also receive the following error message:
The page you are looking for might have been moved or had its name changed.
If you use a network monitor tool to capture network traffic, you may notice that a TCP reset occurs when Internet Explorer is receiving the page. Internet Explorer then generates another POST request if the original request was a POST request. Or, Internet Explorer may send a GET request instead.
You’d think that Microsoft would fix such a bug, but looking at the Internet Explorer versions that are affected, the list starts back at version 4.0 and goes up all the way to the most recent version as of today – Internet Explorer 8. Brilliant.
If you’re developing Drupal based websites, 30 CSS files are nothing, especially with the more advanced themes and modules. It’s enough that you include the theme, views and panels to easily top this limit.
But, there are a few things that might help.
For one, the IE Unlimited CSS module saved me with the Drupal 6 installations.
In some cases, though not all, the built-in Drupal CSS aggregation/optimization may help (if it’s aggregated already, that is).
How to enable Drupal CSS file aggregation
- Log in as your Drupal site’s administrator.
- Go to the Administer » Site configuration » Performance page.
- Check the Enabled checkbox for Optimize CSS .
- Click the Save configuration button.
Another option, if you’re not in Drupal is using a CSS optimizer solution. Here’s from Nadeau Software’s list, and although they claim it won’t speed up by much, it might save you from IE.
CSS optimizers
Hand-editing CSS to make it more optimal is tedious. Instead, use a CSS optimizer application. Here's a few of the many available:
- Blumentals Software's CSS Toolbox (freeware)
- CSS Drive's CSS Compressor (freeware)
- Michael Bianco's CSS Optimizer (freeware)
- Robson's CSS Compressor (freeware)
- Lottery Post's CSS Compressor (freeware)
- CSS Tidy (freeware)
- CleanCSS (freeware)
- Code Beautifier (freeware)
- CSS Formatter and Optimiser (freeware)
- CSS Code Formatter and Optimizer (freeware)
- ... and many more based upon CSS Tidy
It never ceases to amaze me how a serious company as big as Microsoft, with all the resources available to it, keeps getting the whole browser thing wrong. What’s even more remarkable, is that there are those among us who still use that thing.