user1100149
user1100149

Reputation: 266

Can someone explain this Sass For loop syntax - #{$i}

In the Sass docs, we have this:

@for $i from 1 through 3 {
  .item-#{$i} { width: 2em * $i; }
}

I understand the loop. But I don't understand where in .item-#{$i} why the $i variable is encased in #{}? Why not just write $i?

I've looked around and can't find anywhere that explains this.

Upvotes: 0

Views: 277

Answers (1)

Brian Stephens
Brian Stephens

Reputation: 5271

It's called Interpolation, and is needed when using a variable in a selector or property name. See http://sass-lang.com/documentation/file.SASS_REFERENCE.html#interpolation_

Upvotes: 1

Related Questions