2017-12-28 24 views
0

私はグリッドシステムの列を作成するためにサスのミキシングを使用しています。しかし、私は出力に少し問題があります。

これは、.colクラスのmy sass関数です。あなたがスクリーンショットで見ることができるように。私がsassファイルをコンパイルした後、圧縮されたcssファイルには "///////"スラッシュが多すぎます。

.col-#{$key} { 
 
    $str: "&"; 
 
    @for $i from 1 through $columns { 
 
    $str: $str + "," & + "-" + $i + "," + & + "-offset-" + $i; 
 
    } 
 
    @at-root #{$str} { 
 
    @include grid-column; 
 
    } 
 
    & { 
 
    @include grid-column-span(auto); 
 
    } 
 
    @for $i from 1 through $columns { 
 
    &-#{$i} { 
 
     @include grid-column-span($i); 
 
    } 
 
    &-offset-#{$i} { 
 
     @include grid-column-offset($i); 
 
    } 
 
    } 
 
}

CSS出力 enter image description here

あなたは、CSSからこれらのスラッシュを取り除くためにどのように任意のアイデアを持っていますか?

ありがとうございました!

+0

なぜ1から$ columns {$ str:$ str + "、"&+ " - " + $ i + "、" +&+ "-offset-" + $ i; } '?それは私には何もしないようです。 – Sam

答えて

1

.col-#{$key}の範囲外にある行$str: "&";を移動してみてください。

+0

ありがとうサム! $ str: "&";を動かす代わりに。私は$ strの後に$ str +を削除しました:私の問題を解決しました。 –

関連する問題