max number of css files

10 Dirty CSS Tips and Tricks

Here is a collection of 10 CSS tips, tricks in blogposts I have written during the last year that you may find useful:

01. Better Image Scaling and Resampling in Internet Explorer
02. Setting Opacity and Other Filters in Internet Explorer 8
03. The 32 External CSS Files Limitation of Internet Explorer and More
04. Unobtrusive CSS Loading Indicator for Images
05. CSS: Filtering and Distinguishing Google Chrome and Safari
06. Controlling the CSS Opacity Rate of Child Elements in Transparent Parents in Internet Explorer
07. $style – Get Any CSS Property Value of an Object
08. Emulating border-color: transparent in Internet Explorer 6
09. An Exotic CSS Hack for Internet Explorer
10. CSS Watermark
11. Using CSS to Style Radiobuttons and Checkboxes in Safari and Chrome

Visit http://acidmartin.wemakesites.net – the home of Acid.JS – The AJAX Tools and Widgets Library

Advertisements

The 32 External CSS Files Limitation of Internet Explorer and More

Recently, a client of mine complained that certain css files included in his webpage do not load in Internet Explorer. I took a look at his code and noticed that he had tried to register more than 40 external stylesheets in the <head>...</head> section of his webpage, which reminded me of a less known limitation in Internet Explorer. Some people call it a bug, but I prefer calling it a rational limitation, and here it goes:

The max number of external CSS files that can be loaded in a single webpage via the <link /> tag, or included via the @import url directive is 32. Any css file beyond this limit will not be parsed.

And yet another limitation, which is even less known – the max filesize of an external stylesheet that can be loaded by Internet Explorer should not exceed 288Kb.

These are not fixed in Internet Explorer 7 and 8 beta, and this gives me a reason to believe that IE developers are well aware of this, and such limitation is not a bug at all, but as I mentioned before – a rational limitation, as things in web development should be within reasonable limits.

So, please, please, avoid including that many files and keep the size of your stylesheets within a reasonable and maintainable length and size. The “cascading” in Cascading Style Sheets delivers all that is necessary to write reusable, scalable, maintanable and beautiful code.

Visit http://acidmartin.wemakesites.net – the home of Acid.JS – The AJAX Tools and Widgets Library