K
K
Kirill Popolov2014-08-10 09:19:11
Sass
Kirill Popolov, 2014-08-10 09:19:11

How to set the class name of a sprite in compass?

Hello.
I generate sprites using compass:

$icons-sprite-base-class: ".icon";
$icons-spacing: 5px;
$icons-sprite-dimensions: true;
$icons-layout: smart;
@import "icons/*.png";

@include all-icons-sprites;

As a result, the class name of each image looks like this: . icons -close
How to set the class name . icon -close without renaming images folder?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
O
omo, 2014-08-10
@ezhikov

You can use this notation for a sprite:
And call it in the right place like this:

.icons { background: sprite($icons, icon-name) no-repeat; }
.icons.facebook { @include sprite($icons, icon-facebook); }

The second entry specifies only the background-position, i.e. the sprite background must already be defined for the element (it is convenient when there are many elements of the same type with different icons, sort through @each).
Read more here compass-style.org/reference/compass/helpers/sprites

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question