Jake Wilson - 5 months ago 27

CSS Question

I have a SCSS mixin like so:

`@for $i from 2 through 4 {`

&__layout:nth-child(#{$i}) {

transition: transform 0.4s ease #{$i}s;

}

}

How can I subtract something from

`#{$1}s`

`transition: transform 0.4s ease #{$i+1}s; // <-- adds 1 to value as expected`

But this gives an error:

`transition: transform 0.4s ease #{$i-1}s; // Undefined variable: "$i-1".`

So I assume this is because variables can have dashes in them? So how do I escape the minus sign so I can subtract from the variable?

Answer

yes just give the space it works

```
@for $i from 2 through 4 {
&__layout:nth-child(#{$i}) {
transition: transform 0.4s ease #{$i - 1}s;
}
}
```

Hope this helps