CODEWITHSUNDEEP
cssinternet-explorercross-browserinternet-explorer-9frontend
timmy
timmy

Reputation: 488

Only ie 9 does not render full css?

I'm testing this website cross browser and ie 9 does not render the full css. Ie 8 and anything above ie 10 do.

I've searched for the most common bugs and limitations on ie 9 and tested for them.

I have counted the number of css selectors, the limit is 4096, this stylesheet has 3000. So it's not that.

There are no @import statements in the css file.

Unfortunately this project is not yet publicly visible.

I have included two screenshots the first one displays the incorrect rendered version. The second one displays the correct rendered version.

I hope someone can help me.

EDIT:

I have extensively tested this page in ie 9 a few weeks ago and everything rendered great. At the moment it renders correct in ie 8 and 10/11. So what I'm thinking is I'm hitting a limitation or something.

rendered incorrect

rendered correct

Upvotes: 1

Views: 101

Answers (1)

timmy
timmy

Reputation: 488

I compiled and merged all my css files in to one big css file. This file got to big. I checked the loaded css file in ie 9 and it loaded up to 70% of the file. So I tested with splitting the file in two.

With two stylesheets it rendered great.

So although I'm way under 4096 css selectors (ie 9 selector limit) the amount of rules also make a difference. Roughly the max amount of rules in a css file is 12000 (12K). Way too much. I found out that all of the foundation plugins get compiled. So I'm going to switch off what I'm not using.

Upvotes: 2

Related Questions