Stylus. Negative variables
How do I use negative variables in Stylus?
I am writing a mixin for a sprite:
sprite-medium(col,row)
width = 40px
height = 40px
width: width
height: height
background: url('../img/medium-sprite.png') no-repeat
background-position: -col*width -row*height
And I have an error. I can of course write negative values in the mixins call, but this is not a perfect solution. Can anyone please help? Thank you.
+3
source to share
1 answer
Stylus handles -
before col
and row
as part of the name - they need to be separated in order to work as -(col * width)
, however, you also need to avoid subtracting the two values you want for the background position. Here's a solution with a work background calculation and simplified a bit by looking for properties:
sprite-medium(col, row)
width: 40px
height: 40px
background: url('../img/medium-sprite.png') no-repeat
background-position: -(col * @width) -1 * (row * @height)
Hope it helps.
+5
source to share