Respond doesn't work with -sass-debug-info in CSS?

[qris]

Just discovered that my app's media queries don't respond on IE8. Respond.js seems to find a large number of media queries, and almost all of them are SASS debug info. See the attached file for example, which works in most browsers but not in IE8 with respond.js (for me).

It never seems to interpret the real media queries in that file. If I disable the debug info then it works in respond.js. Tried both 1.4.2 and current HEAD of respond.js, same results.

Is it possible that it doesn't like something about the debug info?

https://gist.github.com/qris/11291896

[nwhittaker]

+1

[qris]

Same issue as #148 but closed unfixed?

[scottjehl]

Yeah, you'll need to remove commented-out media queries from your CSS for respond to work. The parser is pretty simple and works with any mqs it finds.

On May 27, 2014, at 10:22 AM, Chris Wilson [email protected] wrote:

Same issue as #148 but closed unfixed?

—
Reply to this email directly or view it on GitHub.

[nwhittaker]

This case is about using media queries for Sass' debug-info blocks. Looking closer, this issue stems from the fact that nested media queries are not supported -- since the debug-info queries are added inside of the real media query blocks.

[jbates]

+1
This got me, especially coupled with a Drupal base theme issue which made it really hard to get rid of old aggregated CSS that still had the debug blocks.

In case anyone ends up here from the same Drupal aggregated CSS nightmare I just came from, here's a relevant thread: https://drupal.org/node/1995938