Add respond.js option (or other option for supporting @media queries in lt IE9) [#1886216]

Hi, first of all, loving this theme, full responsive and all, till i came to internet explorer 8 and 7..
HTMLshiv works, but it doesn't seem to load squaregrid(selectedwidth).css file in the styles directory of squaregrid. It does load the default css file in this directory.

In my case i have selected grid 640 and in all other browsers (firefox, safari, opera, chrome) the squaregrid640.css is loaded...
In Internet Explorer 8 and lower, it's missing the .sg and .push classes that comes from this css file.
I also tried "Aggregate and compress CSS files", as IE doesn't load more then 31 stylesheets, but that didn't seem to be the issue..

Comment	File	Size	Author
#3	squaregrid_respondjs_1.patch	6.91 KB	alexrayu

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Comment #1

laura s CreditAttribution: laura s commented 16 January 2013 at 16:43

Title:	squaregrid css not loaded in ie8 and lower	» Add respond.js option (or other option for supporting @media queries in lt IE9)
Version:	7.x-3.0-alpha5	» 7.x-3.x-dev
Category:	bug	» feature
Priority:	Major	» Normal
Status:	Needs work	» Active

This is because IE8 (and earlier) doesn't support @media queries, so all the css in the squaregrid files is invisible to IE8 and earlier. (html5shiv only handles the making of primary html5 elements into something IE8 and earlier can read.)

Perhaps I should add an option for enabling respond.js? I'm changing this issue to a feature request for that. (I'm not sure it's the best way to go, since http://drupal.org/project/respondjs exists and you can always add respond.js to your child theme.)

Also, another option is Modernizr (which includes Respond functionality, and also has a ton of options that you can configure to add other CSS3 support for older browsers). There's a module for Modernizr http://drupal.org/project/modernizr but the real config happens on the Modernizr site (linked from the module page) where you can pick and choose the support you need before downloading the js. You want to enable only the support you need to minimize the js file size before downloading. There are a ton of options here, which is why I do not intend to try to incorporate Modernizr directly into Square Grid.