bootstrap列彼此堆疊時，應該不會

Question

我的網站上有3x4列，總共相當於12列。但由於某種原因，它們恰好相互疊加，即使有足夠的空間供他們使用。我無法弄清楚是什麼導致他們崩潰。我有一個小小的演示，你可以看到紅色的盒子堆疊在一起。

HTML：

<div class="row portfolio"> 
    <div class="body_container2"> 
    <h1 class="display portfolio_h1">Portfolio</h1> 

    <div class="col-lg-4"></div> 
    <div class="col-lg-4"></div> 
    <div class="col-lg-4"></div> 
    </div> 
    </div> 

Codepen：

http://codepen.io/Limpuls/pen/Qpyygj

Answer 1

你的代碼更改爲：

<div class="body_container2"> 
<h1 class="display portfolio_h1">Portfolio</h1> 
<div class="row portfolio"> 
    <div class="col-lg-4"></div> 
    <div class="col-lg-4"></div> 
    <div class="col-lg-4"></div> 
</div> 
</div> 

http://codepen.io/anon/pen/yMeexb

Answer 2

所有列必須直接在行（母公司必須是一個行），這樣

<div class="row"> 
    <div class="col-lg-4"></div> 
    <div class="col-lg-4"></div> 
    <div class="col-lg-4"></div> 
    <div class="col-lg-4"></div> 
    <div class="col-lg-4"></div> 
    ... 
</div> 

你可以看到我Ť這裏工作：http://codepen.io/anon/pen/oZbbaQ