コンパスサスで「右-300px」などのスプライト位置を生成する方法は?
sass は背景位置を数値でしか出力できないことがわかりましたが、スプライト位置を右揃えまたは下揃えにする必要がある場合があります。
plsは以下の私のコードを参照してください:
<style type="text/css">
/* ------- scss ------- */
$map_btn: sprite-map("sprite_btn/*.png");
.btn,.btn span{
display:inline-block;
background-image: sprite-url($map_btn);
background-repeat: no-repeat;
}
.go_to_cart{
background-position: sprite-position($map_btn,go_to_cart);
span{
background-position: sprite-position($map_btn,go_to_cart);
}
}
/* ------- output ------- */
.btn,.btn span{
display:inline-block;
background-image: url('../images/btn_sprite.png');
background-repeat: no-repeat;
}
.go_to_cart{
background-position: 0 -300px;
}
.go_to_cart span{
background-position: 0 -330px;
/* -------
but I want to output like this bellow:
how to write in scss?
------- */
background-position: right -330px;
}
</style>
<a href="#" class="btn go_to_cart">
<span></span>
</a>