Question

我在将margin-right应用于我的article.col-sm-8时遇到问题，因为如果将（例如）10px添加到margin-right，我的aside.col-sm-4将放在文章下面，我不会＃ 39;我想要这个，我希望我旁边的文章。

我的html结构

<body>
<div id="wrapper">
    <section class="row">
        <article class="col-sm-8">

        </article>
        <aside class="col-sm-4">

        </aside>
    </section>
</div>
</body>

我的包装器有max-width：1000px;

没有边距的布局 - 文章

enter image description here

有文章边距的布局

enter image description here

我想要这个，在文章

中添加边距权限

enter image description here

希望你能帮助我，问候!!

Answer 1

Bootstrap 3使用填充而不是边距来创建列（排水沟）之间的间距，因此如果您在aside div中使用div，您将看到排水沟。

由于您希望它为10px，因此您可以在article和aside两侧设置5px的填充...

http://bootply.com/130020

Answer 2

我不是专家，但您可能想要做的是download a customized version of bootstrap，您可以在其中更改@ grid-gutter-width。这将允许您更改所有内容的边距。

你可以尝试重写这个css，但我的猜测是，在所有LESS的东西中，它已经习惯于构建其他样式，在你知道它之前，你会希望你这样做。

除此之外，我认为您将遇到网格系统的问题并使用所有列并添加边距。 100％+ 3％将始终在下一行结束。

另一种选择可能是使用填充，这样就可以为网格系统保持宽度，但是你可以获得视觉距离。

使用Bootstrap 3在cols之间添加边距

2 个答案: