2

Let's say I want to generate the following CSS using SCSS:

.selector-1,
.selector-2,
.selector-3,
.selector-4,
.selector-5 {
    color: blue;
}

How would you write that in SCSS? Using this @for loop

@for $i from 1 through 5 {
  .selector-{$i} {
    color: blue;
  }
}

would naturally generate

.selector-1 {
    color: blue;
}
.selector-2 {
    color: blue;
}
.selector-3 {
    color: blue;
}
.selector-4 {
    color: blue;
}
.selector-5 {
    color: blue;
}

which would be too much code.

Lukas
  • 9,752
  • 15
  • 76
  • 120
  • 1
    It is in fact a duplicate, despite heavy googling, I did not find the other question. – Lukas Apr 07 '16 at 12:22
  • can you hardcode like this? $i: 1; .selector-#{$i}, .selector-#{$i+1}, .selector-#{$i+2}, .selector-#{$i+3}, .selector-#{$i+4}, .selector-#{$i+5} { color: blue; } – godblessstrawberry Apr 07 '16 at 14:03
  • No, cos what would be the point of using a loop? And I am using a loop cos I am doing this 24 times. – Lukas Apr 07 '16 at 14:26

0 Answers0