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;'是否有任何具体原因。什么是解决我问题的最佳方法。

Answer 1

.row旨在用于container。由于container具有填充以调整.row中的负边距，因此.row内使用的网格列可以调整为容器的整个宽度。请参阅Bootstrap文档：http://getbootstrap.com/css/#grid

因此，您可以将.row置于.container或.container-fluid

之内的更好解决方案

Answer 2

您可以使用行液而不是行，然后您就不会遇到此问题。（对于以前版本的bootstrap）

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

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

Answer 3

您使用的是Bootstrap 3吗？我的css版本有-15px，而不是-13px。无论如何，我只是完成了你所做的事情，并覆盖了这种风格。我相信它是因为.container类在左侧和右侧有一个15px的填充，行上的这个负边距会将该内容拉回到容器的边缘。

Answer 4

旧话题，但我想我找到了另一种下降解决方案。将class="row"添加到div将导致以下CSS配置：

.row {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}

我们要保留前3条规则，我们可以使用class="d-flex flex-wrap"（请参见https://getbootstrap.com/docs/4.1/utilities/flex/）来做到这一点：

.flex-wrap {
    flex-wrap: wrap !important;
}
.d-flex {
    display: -webkit-box !important;
    display: flex !important;
}

尽管它添加了重要的规则，但在大多数情况下应该不成问题...

Answer 5

我也遇到了同样的问题，最初，我删除了行的左-ve边距，并删除了水平滚动条，但这并不好。然后，经过45分钟的检查和搜索，我发现我正在使用容器流体，并且正在除去填充物，并且其内部行具有左右负边距。所以我给了容器流体使其填充，一切恢复正常。

如果您确实需要删除容器流体填充，请不要仅删除项目中每一行的左右负边距，而要引入一个类并将其用于所需的容器中

Answer 6

旧话题，但是最近我受到了这一影响。

使用类“ row-fluid”而不是“ row”对我来说效果很好，但是我不确定将来是否完全支持它。

因此，在阅读Why does the bootstrap .row has a default margin-left of -30px之后，我只使用了<div>（没有任何行类），它的行为与<div class="row-fluid">完全一样

Answer 7

这是您简单易懂的答案

转到您要给其负边距的班级，然后将其复制并粘贴到班级内部。

负利润率最高的示例

mt-n3

负边距底的示例

mb-n2

Answer 8

要删除所有行的边距：

.row {
    margin: 0px !important;
}

Answer 9

您创建的任何行，将每一行包装在容器 div 中以解决问题。

<!-- row 1 -->

<div class="container">
<div class="row"></div>
</div>

 <!-- row 2 -->

<div class="container">
<div class="row"></div>
</div>

Answer 10

我用过 div class =“form-control” 代替 div class =“row”

这对我有用。