2014-10-10 48 views
0

我在堆叠折叠的容器时遇到问题。我把它们设置在row的三列宽度为4.如果添加了另一列,它将被推到下一行,这是所需的行为。但是如果我打开关于新开始行的容器,当它打开时它会将新包装的容器推向右侧,所以现在布局错了。如果您取消折叠第一行,它会恢复。下面的快速图片描述了情况。Bootstrap 3 - 用折叠容器包装行

编辑:当三列在col-md-4设置下时,clearfix很好用。当它缩小到小尺寸时,我将它设置为col-sm-6,然后clearfix使它有两列,一列一列,然后三列的下一行再次开始。任何解决方案或我必须重新考虑我的布局?

enter image description here

+0

把4列在一个新的行clearfix – DaniP 2014-10-10 19:52:26

+0

http://getbootstrap.com/css/#grid-responsive-resets – DaniP 2014-10-10 19:53:28

回答

1

您需要第三个元素后添加clearfix元素来解决这个布局。

<div class="clearfix"></div> 

更多信息可以在这里找到:http://getbootstrap.com/css/#grid-responsive-resets

+0

都会容器仍然在每个三个容器之间有一个带有clearfix的'row'元素,还是每个都有自己的行? – Jared 2014-10-10 19:49:35

+1

你也可以做,真的。您可以在每行设置3个元素,或者您可以创建1行,每个元素包含所有元素,并在每3个元素后面有一个清除修复, – Marcelo 2014-10-10 19:51:48

+0

当三列在col-md-4设置下时,这很有用。当它缩小到小尺寸时,我将它设置为'col-sm-6',然后clearfix使它有两列,一列一列,然后三列的下一行再次开始。任何解决方案或我必须重新考虑我的布局? – Jared 2014-10-10 20:28:49