susy, media queries, and lt IE9 [closed]

Question

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.

Closed 7 years ago.

I was wondering what (if any) shims you use to get the magic grids to respond correctly in SUSY in IE8 and under?

On non-susy sites I've always used moderizr or the shim from google and they worked as expected. I'm working on my first SUSY site and the media queries for the largest size won't kick in.

http://dev.apehangar.com

Answer 1

It's not clear to me what sort of "shim" you are looking for. I don't know any good way to make MQs work in IE8, but Susy does have an option to output styles under a fallback class. Those styles wont respond dynamically, but you can use it to send IE a desktop site:

.page {
  width: 20em;
  @include at-breakpoint(30em 12 no-mediaqueries) {
    width: 70em;
  }
}

Will output:

.page { width: 20em; }
@media (min-width: 30em) { .page { width: 70em; } }
.no-mediaqueries .page { width: 70em; }

You can replace "no-mediaqueries" with any fallback class you want. Just make sure that class is applied using Modernizr or IE conditional comments.