To handle IE9, I need to have Meteor NOT concatenate the css files

[patmoore]

IE9 has a 4095 selectors / stylesheet limit. ( you can read a little bit about that here : http://stackoverflow.com/questions/9906794/internet-explorers-css-rules-limits ). Once that limit is hit, the rest of the styling rules are silently ignored. (thank you Microsoft employees for not even bothering with an error message to console)

I would like a clean solution from the Meteor community on how to have Meteor serve the original css files (minimizing is o.k. but not concatenated) to IE9-.

We are doing a temporary hack of asking user to upgrade but that seems really lame since the solution is "simply" get Meteor to not concatenate the css files.

see also : http://stackoverflow.com/questions/22117069/to-handle-ie9-i-need-to-have-meteor-not-concatenate-the-css-files

bug report filed per request by: http://stackoverflow.com/users/1626821/imslavko and http://stackoverflow.com/users/1007676/dave

[glasser]

Thanks for opening the issue so we can track it. We'd like to have better minification options (and @Slava has started to think about them).

[abhiaiyer91]

Hello,

This is Abhi from www.workpop.com. We're experiencing the same issue in Internet Explorer 9 and it is affecting many of our users. Is there a plan to fix this issue?

Thanks so much.

Abhi Aiyer

[avital]

For reference, the --debug flag to meteor deploy and meteor build (previously meteor bundle) disables both minification and concatenation.

[Slava]

@avital that wouldn't affect CSS concatenation though. We concatenate CSS even in debug mode (with a supporting source map).

[avital]

YLSNED

[MiroRadenovic]

same problem here. we are stuck using meteor in production for IE9 users!

[scmart]

This is also a very annoying problem for us.

[MiroRadenovic]

a temp solution is to split the css using bless (http://blesscss.com/)
and add in your

<!--[if lt IE 10]><link href='http://PATH_TO_YOUR_CSS/style.css?0.9749983360525221' rel='stylesheet' type='text/css'><![endif]-->

in this way, IE users will download 2 css: the one created from meteor and the one splitted with bless

please note that we are manually appending a timestamp in the querystring to avoid browser caching the css

[d4nyll]

Any update on this issue? Would it be much trouble if during the build, we generate ie9-specific CSS files, split it into chunks which fits the 4096 selector limit, _but only if required, and then add a HTML conditional comments _if required so IE9 will load that CSS, and the rest will not bother with it.

And if this is not an issue, then the IE9 CSS won't be generated in the build, and conditional comments won't be in the final HTML.

Not looked much into it, but this script might be useful. There's also this website.

[MiroHibler]

Hey @patmoore, are you using Iron.Router? If you do, would it be possible to manually split your CSS per routes? Than you'd be able to lazy-load them with preloader.

Not exactly what you're looking for, but may help...

[havays]

I used two CSS files and meteor doesn't concatenate them, for this i have created separate package which injects the CSS file, placed in public folder, directly into the head tag.
Below is the snapshot of the code:

var head = document.getElementsByTagName('head')[0];

//Generate a style tag
var style1 = document.createElement('link');
style1.type = 'text/css';
style1.rel = "stylesheet";
style1.href = '/style1.css';

head.appendChild(style1);

[lassombra]

What is the status of this? Meteor claims to support IE 8/9 but this is clearly a case of broken support.

[Slava]

Presumably the change proposed here will help.

[patmoore]

@MiroHibler Would preloader work to provide a print only css?