monkeymanbob monkeymanbob - 4 years ago 210
CSS Question

SCSS loop interfering with transform: rotate

I'm trying my hand at scss for an animation and I'm having trouble with this loop. I'm trying to rotate 8 objects by 45 degrees each. When I type in:

@for $i from 1 through 8
transform: rotate(45*$ideg)

It breaks the compiler because it thinks the variable is $ideg. But the deg needs to be right against the number for the transform. When I put a space between, it doesn't work. Ideas?

Answer Source

You can interpolate it just like you did with the id selector:

@for $i from 1 through 8 
    transform: rotate(#{45*$i}deg)
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download