s css обеспечение css классов с. внутри

Question

У меня есть для l oop в s css, и я хотел бы вывести что-то вроде этого:

.font-1.0em {font-size:1.0em} 
.font-1.1em {font-size:1.1em} 
.font-1.2em {font-size:1.2em} ....

Я написал s css как это

@for $i from 1 through 50 {
    $val: $i + em;

    $val2: $i / 10 + em;

    &.font-#{$val} {
        font-size: #{$val2} ;
    }
}

который выводит

.font-10em {font-size:1.0em} 
.font-11em {font-size:1.1em} 
.font-12em {font-size:1.2em} ....

Есть ли способ исправить это?

Answer 1

То, что вы пытаетесь достичь, должно быть довольно легко решено, используя ту же формулу, что и в $val2 в ваших $val

@for $i from 1 through 50 {
    $val: $i / 10 + em;

    $val2: $i / 10 + em;

    &.font-#{$val} {
        font-size: #{$val2} ;
    }
}

компиляциях в

.font-0.1em {
    font-size: 0.1em;
}

.font-0.2em {
    font-size: 0.2em;
}

Или я что-то упустил?