Hello,

I am using a Zen subtheme and have created two custom stylesheets that are for two different screen resolutions.

I created one named "custom.css" and one named "1280.css". The custom.css file is for screen resolutions with a min of 1440, and the 1280.css is for screen resolutions with a min of 1280. FIREFOX pulls them okay but Chrome does not, it only uses the custom.css and IE7 just shows blank content with the title of the page.

Can someone please tell me what I could be doing wrong?

I added the markup in my .info file and it looks like this:

stylesheets[all][] = css/normalize.css
stylesheets[all][] = css/wireframes.css
stylesheets[(min-width: 1280px)][] = css/1280.css <-----------
stylesheets[(min-width: 1440px][] = css/custom.css <-----------
stylesheets[all][] = css/layouts/responsive-sidebars.css

I also tried aggregating the stylesheets and clearing cache but Chrome and IE7 still won't work.

Thank you for your help. :D

Comments

absoludo’s picture

First of all you should read the code more carefull since you are not closing your parenthesis correctly.
You are using:
stylesheets[(min-width: 1440px][] = css/custom.css
Which should be:
stylesheets[(min-width: 1440px)][] = css/custom.css

Have you tried clearing the browser cache (not the Drupal cache)?
Have you tried this on other computers using the same browser?

spasebar’s picture

OMG I just want to beat you up LOL!!!

I went OVER AND OVER that code trying to figure out what I was doing wrong.... I didn't even notice that I missed closing that parenthesis. That fixed it in Chrome, but IE7 still doesn't recognize any content :(

Yes, I cleared cache on three different computers here. Two PCs and one laptop. Once I closed that statement with the parenthesis it worked for chrome though.

Thank you so much.. If you have any suggestions for IE7, I would love to hear. :)