Bootstrap 行类包含 margin-left 和 margin-right 这会产生问题

Question

我正在使用 Bootstrap ‘ row ’ 类来对齐 divs 一个在另一个之上，工作正常但是

.row {
   margin-left: -15px;
   margin-right: -15px;
 }

我注意到它指定 margin-left 和 margin-right 属性为 -13px，因此我的内容向左移动。所以我所做的是添加另一个类如下：

 .row-no-margin {
   margin-left: 0px;
   margin-right: 0px;
}

这解决了目的，但我仍然想知道是否有任何特定原因 'margin-left: -15px; ‘.解决我的问题的最佳方法是什么。

原文由 Tarun Gupta 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

.row 意味着在 container 中使用。由于 container 有填充来调整 .row 中的负边距， .row 中使用的网格列可以调整容器的全宽–请参阅 引导文档。

下面举个例子来说明

因此，更好的解决方案可能是将 .row 放在 .container 或 .container-fluid

原文由 Zim 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

你可以用row-fluid代替row，就不会出现这个问题了。 （对于以前版本的引导程序）

无论如何，我不确定最近的版本 3：

问题是第一列左边不应有半个装订线，最后一列右侧不应有半个装订线。他们不像某些网格系统那样在这些列上使用某种 .first 或 .last 类，而是将 .row 类设置为具有与列的填充相匹配的负边距。这“拉”了第一列和最后一列的排水沟，同时使其更宽。

有关此内容的更多信息， 为什么 bootstrap .row 的默认边距为 -30px？

原文由 4dgaurav 发布，翻译遵循 CC BY-SA 3.0 许可协议