Search code examples
breakpointssusy-compass

Use sprite into at-breakpoint not run correctly


When i use sprite into the at-breakpoint($desktop) (susy) the generit sprite background image not affect my .logo class

SCSS :

@include at-breakpoint($desktop) {
  .logo{
     @include logos-sprite('my-set-m');
  }
}

CSS :

.logos-sprite { background: url('../images/spr/logos.png') no-repeat; }

But without at-breakpoint() it's ok (.logo merged with .logo-sprite) ! (i need include sprite into brakpoint )

SCSS :

//@include at-breakpoint($desktop) {
  .logo{
     @include logos-sprite('my-set-m');
  }
//}

CSS :

.logos-sprite, .logo { background: url('../images/spr/logos.png') no-repeat; }

Any solution?


Solution

  • That's because magic sprites use @extend which is not supported inside media-queries. You will have to use the more finely-tuned compass sprite tools to create your own workaround.