2

現在、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 倍の幅で使用したりするにはどうすればよいですか?

どんな助けでも素晴らしいでしょう。

ありがとう

4

0 に答える 0