Life, love, and Technology?A site for testing the new tools I'm building, and a little talk about what I'm learning on the way. |
Internet Explorer CSS File Size LimitFriday, January 25, 2008 Today I encountered a problem where in IE7 and IE6 it appeared as if some parts of my CSS style was not loading. I tracked the problem down to what appears to be a file size limit of ~288kb for .css files. In IE only the first 288kb in a file will be read and processed. Any CSS after 288kb will be ignored. In this particular case I was loaded a CSS file of 347kb. Firefox does not seem to have a limit. The limit appears to be a "per file" limit. You can split the CSS into two files and it will work fine. You may be asking yourself, why would you ever have a CSS file which is 347kb? Good question... but we use a large file size in our site design application at http://rhythmwebdesign.com The CSS ends up being gzipped and is only 35kb when you download it when loading the designer.
CommentsThere are 3 comments - add your comment Ops!! That does not sound very good for us. But am am sure you'll find a way around it. PlNG - Long Island, New York - Thursday, June 12, 2008 11:59 AM I went to try and test this, and I must have done it wrong.
Yet my test yielded yet a different but still important result, so it seems I have encountered yet a third limitation to CSS in IE (first one I read about on the web was @import being 32 max declarations per sheet and nested 3 deep max, 2nd is this one). I'm not sure if this is specific to the situation, but it seems like IE will only allow a selector to be declared 4096 times (or 1024*4) I did the test by declaring "#i{color:#000000;}" and incrementing color by 20 for each line to account for each character / byte [Windows CRLF is 2 characters]. I then made a test element with the same ID on the test page, and placed an onload alert event pointing to a function that returns document.getElementById("i").currentStyle.color; Thinking about this while I typed this comment, my stylesheet is extremely sparse and hits 80k. Perhaps you too hit the 4096 declarations limit? Marco J Rossi - Manila, Philippines - Wednesday, July 09, 2008 11:30 PM I agree. I read in the MSDN website that when adding CSS rules in a style object by JavaScript, after the 4096th rule, Internet Explorer will display and exception error and the should-be-added rule will not be added. I think that is the reason why some web developers thought that there is a file size limit on a CSS file -- I would rather test later with more than 300k CSS file and just about a hundred rules, so that I could find out if there is no really a file size limit in a CSS file. Furthermore, I had just tested having more than 32 styles in a web page and have it viewed in IE; only the first 32 are processed by the browser. The rest are ignored. So is the @import. Firefox and other browsers do not have such limits. That's why I hate Internet Explorer. I love Firefox (hope this is not a spam).
|
