grunt-spritesmith/src-test/expected_files/sprite_positions.cssOpts.css

Grunt task for converting a set of images into a spritesheet and corresponding CSS variables.

/*
Icon classes can be used entirely standalone. They are named after their original file names.

Example usage in HTML:

`display: block` sprite:
<div class="icon-home"></div>

To change `display` (e.g. `display: inline-block;`), we suggest using a common CSS class:

// CSS
.icon {
  display: inline-block;
}

// HTML
<i class="icon icon-home"></i>
*/
#container .sprite1 {
  background-image: url(sprite.cssOpts.png);
  background-position: 0px 0px;
  width: 50px;
  height: 50px;
}
#container .sprite2 {
  background-image: url(sprite.cssOpts.png);
  background-position: 0px -50px;
  width: 50px;
  height: 50px;
}
#container .sprite3 {
  background-image: url(sprite.cssOpts.png);
  background-position: 0px -100px;
  width: 100px;
  height: 200px;
}