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 has 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.