1

プロジェクトで Foundation 4 と Sass を使用しています。列のガターに問題があります。私の問題は、列が全幅にまたがる場合を除いて、列の左側と右側の両方にパディングがあることです。

したがって、要素が全幅 (12 列) の行がある場合、パディングはなく、幅は 100% です。しかし、複数の列を持つ別の行がある場合、最初と最後の行はガターによってインデントされるため、上の要素と整列しません。

例:

HTML

<div class="row">
    <div class="widget">
        Some contents here
    </div>
</div>
<div class="row">
    <aside>Left aside, first column</aside>
    <section>Right section, last column</section>
</div>

CSS

.widget {
    /*Spans the 12 columns*/
    @include grid-column($total-columns); 
}
aside {
    @include grid-column(3);
}
section {
    @include grid-column(9, true);
}

ご覧widgetのとおり、 にはパディングがなく、aside+よりも大きくなりsectionます。

Bootstrap の最初と最後の列にはパディングがないことを読みましたが、そのようなことをしたいと思います。親行で「折りたたみ」を使用しようとしましたが、何もしないようです。パディングはまだそこにあります。

.first-class最初の列に a を追加して を実行できることはわかって.first-class { padding-left: 0 !important; }いますが、これは私が見つけた最も一般的な答えですが、あまり意味がないようです...

このようなパディングを管理するために、Foundation がグリッド列 mixin にパラメータを追加してくれることを望みます!

4

1 に答える 1

4

このようなパディングを管理するために、Foundation がグリッド列 mixin にパラメータを追加してくれることを望みます!

grid-columnはすでにcollapseプロパティを持っています。padding-right: 0; padding-left: 0自分自身を指定することもできますが、collapse それは自動的に行われます

于 2013-09-25T12:22:06.090 に答える