Skip to content

Instantly share code, notes, and snippets.

@brainbrian
Last active September 24, 2015 16:55
Show Gist options
  • Save brainbrian/909d4915abd3ceab7051 to your computer and use it in GitHub Desktop.
Save brainbrian/909d4915abd3ceab7051 to your computer and use it in GitHub Desktop.
Responsive Sprite SASS Mixin
// Responsive Sprites
// example - @include responsive-sprite(346px, 2192px, 173px, 274px, 0px, 0px);
@mixin responsive-sprite($sprite-width, $sprite-height, $img-width, $img-height, $img-x, $img-y) {
background-size: percentage($sprite-width/$img-width) percentage($sprite-height/$img-height);
background-position: percentage($img-x/($sprite-width - $img-width)) percentage($img-y/($sprite-height - $img-height));
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment