現在、SUSY を使用して、作業中の Web サイト用のレスポンシブ グリッド システムを作成しています。
私の grid.scss ファイルは次のようになります。
@for $i from 1 to $noOfGridColumns+1 {
.desktop-#{$i}{
@include span ($i of $noOfGridColumns);
@media screen and (max-width:641px){
@include span ($noOfGridColumns of $noOfGridColumns);
}
}
&:last-child{
@include span(last $i of $noOfGridColumns);
@media screen and (max-width:641px){
@include span ($noOfGridColumns of $noOfGridColumns);
}
}
}
ただし、別のデスクトップ 6 クラス内でデスクトップ 6 クラスを使用すると、ガター幅が、ネストされていないコンテンツの場合の半分になります。
すべてが列幅に応じてパーセンテージに基づいているため、これが発生する理由は理解していますが、これを上書きしたり、ネストされた DIV のスタイルを追加してガターを 2 倍の幅で使用したりするにはどうすればよいですか?
どんな助けでも素晴らしいでしょう。
ありがとう