How to enumerate SCSS classes

Question

How can I comma-separate classes in Sass (scss) without repeating the CSS itself in the compiled code?

I have:

@for $i from 1 through ($maxcolumns){
  .col#{$i}{
    //code for all columns
  }
}

which generates

.col1{
  //code
}
.col2{
  //code
}

but I prefer

.col1, .col2, ...{
  //code
}

Thanks!

Answer 1

That's what @extend is for:

%commonStyles {
    border: 1px solid;
}

@for $i from 1 through 5 {
  .col#{$i}{
    @extend %commonStyles;
  }
}

Generates:

.col1, .col2, .col3, .col4, .col5 {
  border: 1px solid;
}