引导行类包含margin-left和margin-right，这会产生问题 [英] Bootstrap row class contains margin-left and margin-right which creates problems

问题描述

我使用Bootstrap' row '类来对齐 divs

I am using Bootstrap 'row' class to align divs one on top of another, which works fine but

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

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

What I noticed is that it specifies margin-left and margin-right attributes to be -13px because of which my contents get shifted towards left. so what I have done is added another class as follows :

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

这解决了目的，但我还是想知道是否有'margin-left：-13px; '的具体原因。

This solves the purpose, but I would still like to know if there is any specific reason for 'margin-left: -13px;'. And what is the best approach to solve my problem.

推荐答案

.row 意味着在容器中使用。由于容器有填充以调整 .row 中的负边距， .row 可以调整到容器的全宽。请参阅Bootstrap文档： http://getbootstrap.com/css/#grid

The .row is meant to be used inside a container. Since the container has padding to adjust the negative margin in the .row, grid columns used inside the .row can then adjust to the full width of the container. See the Bootstrap docs: http://getbootstrap.com/css/#grid

以下是要说明的示例： http://bootply.com/131054

Here's an example to illustrate: http://bootply.com/131054

所以，一个更好的解决方案可能会让你把 .row 放在 .container code> .container-fluid

So, a better solution may for you to place your .row inside a .container or .container-fluid

这篇关于引导行类包含margin-left和margin-right，这会产生问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！