I’d written a script to help me practise my French, but when I got to around the 7000th entry into the array the whole thing just stopped working.

It remained fine in firefox, though – so it seems that IE must also have limits on how many items you can have in an array.

Even though document.getElementsByTagName(“style”).length can be greater than 31, document.styleSheets.length won’t be greater than 31. So I think only the beginning 31 style elements will affect CSS rendering.

Here is my solution, appending CSS text to the last style sheet object:

var sheet = null;
try {
	sheet = document.createStyleSheet ();
	sheet.cssText = cssText;
} catch (e) {
	sheet = document.styleSheets[document.styleSheets.length - 1];
	sheet.cssText += "\r\n" + cssText;
}

Or choose the style sheet with minimal CSS text:

var sheet = null;
try {
	sheet = document.createStyleSheet ();
	sheet.cssText = cssText;
} catch (e) {
	var min = 0;
	var idx = 0;
	for (var i = 0; i < document.styleSheets.length; i++) {
		var style = document.styleSheets[i];
		if (min == 0) {
			min = style.cssText.length;
			idx = i;
		} else if (min > style.cssText.length) {
			min = style.cssText.length;
			idx = i;
		}
	}
	sheet = document.styleSheets[idx];
	sheet.cssText += "\r\n" + cssText;
}

I’m sure it doesn’t take a lot of resources for IE to merge all of these style elements together before parsing them?

Thanks.

And some believe that IE will not parse anything beyond 288 kB file size of external stylesheet, but I’ve never seen any confirmation for this.

Thanks for the info Dean and everyone
Another one to add to my book of IE deficiencies

@Dean, thanks for pointing this one out. I literally ran into this problem today and was scratching my head over why a style wasn’t being applied. One look in the IE developer toolbar and I found the problem. However, without my RSS reader picking this up today I would have been scratching for a good deal longer!