loops - 「while」ループ変数と一緒にプロパティ値に%を使用するとSASSエラーが発生する

Question

Foundationのような足場クラスを生成するSASSでループを作成しようとしています。

私はこれを試しました：

$colCount: 12;

$i: $colCount;
@while $i > 0 {
    $result : ($i *100) /$colCount;
  .container-#{$i}_#{$colCount} { width: $result%  ; }
  $i: $i - 1;
}

そして、このようなものを期待しました

.container-12_12 {
  width: 100%;
}

.container-11_12 {
  width: 91.6667%;
}

しかし、これは失敗しました。「％」を削除すると、cssが役に立たないという事実を除いて、うまくいきました。

Answer 1

解決策は次のとおりです。

.container-#{$i}_#{$colCount} { width: #{$result*1%}  ; }

変数に 1% を掛けます。

このスレッドで解決策を見つけました。