Problem in ie7/8 when using 2 stylesheets (linked in head) #124

Closed
domellen opened this Issue Apr 29, 2012 · 4 comments

Projects

None yet

5 participants

@domellen

I had a problem with incorrect styling in ie7 and ie8 when using respond.js on a site that has two stylesheets linked from the html head.

I stripped everything down and managed to figure out that the problem appears when the media queries are in the first stylesheet or if there are queries in both. Strangely, there are no problems (at least with my simple tests) when the media queries are only in the second stylesheet.

The styling errors I found (not exactly the same in ie7 and ie8) are with the margins and the font family, font size and weight, but there are most likely others.

You can see my test pages here : http://ansible.xlii.org/web_design/respond/

Is this a known issue? I couldn't find any mention of this anywhere.

UPDATE 2012-07-31 : I found a fix for my problem: do not use multiple stylesheets, even if they are called from the head with a link tag. I put all the css into one single file (even the fonts, the reset and the themes) and now it works fine as far as I can tell. This is not ideal, so I'll have to do some more testing when time permits.

leslc commented May 17, 2012

Not sure if this will help. I discovered the "@media all" CSS are evaluated after the other @media types (like "screen"). Since your stylesheets are loaded as "media=all", make all your media queries inside the CSS the same "@media all". This will prevent earlier CSS files loaded from reapplying their styles. That seemed to help my site a lot.

However, I'm seeing some other styles on "body" and "html" in earlier CSS files loaded be reapplied in IE7-8 again (when they shouldn't). Still trying to figure out that one.

@leslc Perfect! This fixed my issue with IE8 not properly using respond. Make sure that whatever media type you use when you include your CSS is equivalent to the type you use in your media query.

irbian commented Jan 31, 2013

Just for the record, you are not alone :P

Collaborator

This should be fixed now.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment