I am trying to avoid enabling "Aggregate / Compress CSS" but it seems that if I don't do Zen does not work with IE8. And if I enable compress it creates different css files that don't live inside of my sub theme. Can someone please to a look at my screenshots attached and see what could be going wrong?

CommentFileSizeAuthor
IE.png115.5 KBspasebar
firefox.png638.91 KBspasebar
chrome.png555.14 KBspasebar

Comments

vm’s picture

vm commented
Category: bug » support
Status: Active » Postponed (maintainer needs more info)

how many stylesheets are included in the head? IE: has issues with serving more than 31 stylesheets. The fact that CSS aggregation, moves the aggregated file to the files folder and out of the subtheme shouldn't be an issue as your changes should still go into the subtheme css files, and when cache is cleared the aggregated CSS file is rewritten.

spasebar’s picture

spasebar commented

Hi VM, to answer your question regarding how many CSS are in the head, I don't know :( I am new to all of this and really am trying to figure out this huge learning curve. I know a little but not as much as everyone else on here it seems. To found out how many CSS files are in the head, where would I look?

jay-dee-ess’s picture

jay-dee-ess commented

I have the same problem [edit - should note that I'm not using jQuery cycle here]

Aggregate CSS is on and there are just four CSS files in head.

johnalbin’s picture

johnalbin
they/他
Primary language English
Location Taipei, Taiwan
commented
Version: 7.x-5.1 » 7.x-5.x-dev

IE has a limitation on how many stylesheets it will load. That's one of the problems that the CSS aggregator fixes. While developing you can use this module: http://drupal.org/project/ie_css_optimizer

Belaselm’s picture

Belaselm commented

I had the same error in IE8 and IE7, but it vanished when I changed the responsive sidebars to fixed-width. Maybe responsive sidebars can't determine the page width in IE7 and IE8, and use 0 width?

kristi wachter’s picture

kristi wachter commented

Another thing to try is overriding or disabling the

img { max-width: 100%; }

code in your CSS - that solved the Zen + IE8 + jQuery Cycle problem for me (even with CSS aggregation turned off).

maximpodorov’s picture

maximpodorov commented

I confirm that
img { max-width: 100%; }
breaks images in IE8 if they are not in elements with the specified width (the example is image inside inline element). This is really annoying. Is it possible to provide the solution for this problem?

echoz’s picture

echoz commented

Check if you are using the version of normalize that added width: auto; for IE 8, following the max-width: 100%;

johnalbin’s picture

johnalbin
they/他
Primary language English
Location Taipei, Taiwan
commented
Status: Postponed (maintainer needs more info) » Fixed

Looks like the answer has to do with the max-width and width properties. Nice work, everyone!

maximpodorov’s picture

maximpodorov commented

Will you commit a fix for this bug?

johnalbin’s picture

johnalbin
they/他
Primary language English
Location Taipei, Taiwan
commented

It was. See #1782090: Responsive images in IE8, height isn't adjusted

maximpodorov’s picture

maximpodorov commented

No, the bug (maybe different) is still exists. See my comment #7. Do you need an example illustrating the problem?

echoz’s picture

echoz commented

@maximpodorov, this issue touched on a few different things, why don't you open a new one if your's is not the same as the OP.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.