2014-10-10 95 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