Does IE 8 have a limit on the number of style sheets per page?

Question

In a response about CSS, the user said:

Internet Explorer states that it has a limit of 4096 CSS rules for each file. Link

In addition, it has a limit on the number of style sheets that you can embed in a single document. I think it is 20.

While the MSDN link seems to confirm this (and there is a blog post that confirms this in IE7), is this still the case for IE8?

Answer 1

Yes, IE8 (and even IE9, apparently) limits the number of style sheets to 31 per page.

Telerik has an article and a test page that demonstrate the problem. According to comments in the same article, 4096 rules for restricting files are marked as “Do Not Fix” in Microsoft Connect, but I could not verify this.

Answer 2

This thread assumes that there is a limit of 31 CSS links per page / CSS file, but you can do more than that by using @import and a nested CSS file hierarchy.

Additional information from the Telerik blog on this issue, which makes it clear that this applies to IE8.

Answer 3

Microsoft claims the limit is 30, but the limit seems to be 31 by Telerik . The Telerik blog also mentions 4095 selectors per file.

Answer 4

Thanks to the above testing script I just confirmed this limitation (apparently 30) still exists even in Internet Explorer 9!

Answer 5

I built the site and got into this problem myself. This kept me quiet until an employee pointed to this 31 CSS files. Looking at it, it seemed to me that it is more difficult, because IE8 seems to load some styles from the sheet, but not all of them. He ignored media queries and related classes, as if he was behaving in Quirks mode - even if he was not in Quirks mode, and both were in the same CSS file as the other CSS used. As soon as I combined the CSS files into one file, all this worked fine. Anyway, I just wanted to point out that somehow this limit of 31 also seems to trigger something like Quirks mode.

Answer 6

If you use NPM get Bless, it will sort the problem for you.