Skip to content

Instantly share code, notes, and snippets.

@procload
Created July 2, 2013 19:55
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save procload/5912563 to your computer and use it in GitHub Desktop.
Save procload/5912563 to your computer and use it in GitHub Desktop.
Working around element queries.
@mixin respond-to($viewport-width, $ie-version: 'lt-ie9') {
@media only screen and (min-width: $viewport-width) {
@content;
}
@if $ie-version == 'lt-ie9' {
html.lt-ie9 & { // Using Paul Irish's conditional comments
@content;
}
}
@else if $ie-version == 'lt-ie8' {
html.lt-ie8 & { // Using Paul Irish's conditional comments
@content;
}
}
}
.schedule-component {
background: #FF0000;
width: 10em;
.content & {
@include respond-to(500px) {
width: 16em;
background: #FFF;
}
}
aside & {
@include respond-to(800px) {
width: 32em;
background: #000;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment