0

幅が設定された4つの要素があり、@include span-columns(3,12)各要素を25％で出力します。これは問題ありません。また、各要素にマージンを追加しますが、これを行うと、25％の幅と％のマージンが得られるため、これらの要素のレイアウトが壊れます。一緒に追加されました。マージンと幅を組み合わせる方法を誰かにアドバイスできますか？

SCSS

    .m-info-col{

      .col{
        @include span-columns(3,12);
// tried this margin-right: columns(.5,12);

        &:last-child{
          @include omega;
        }
      }
    }
4

1 に答える 1

1

コンテナーを 12 列で設定し、$gutter-width を値に設定した場合、各列には $gutter-width ギャップ (必要に応じて余白) があります。

以下を使用して susy グリッドの背景を実装する場合:

$show-grid-backgrounds : true;

コンテナコンテキスト内：

@include susy-grid-background;

デザインの背後にガターが表示されます。

span-columns mixin (第 3 パラメーター) にパディングを追加することもできます。ただし、これは常に期待どおりに機能するとは限りません。

私が使用した別の方法は、squish mixin で、列を余白として追加します。これは非常にうまく機能しますが、スキッシュ量として 0.5 列を使用したことはありません。

于 2013-01-30T04:21:57.600 に答える