2015-04-06 23 views
-1

我想創建一個使用引導程序網格的col - * - 6的8個塊的佈局。我把它們放在一行內,因爲它們都包含6個網格列,因爲它將佔用4行。但是,由於列的高度不等,我的佈局會中斷。我知道我可以使用4行類來放置2塊6格柵來解決這個問題。但是,我的問題是,這是唯一的方法來實現這一點,或者我錯過了我目前的做法。這裏是代碼示例 -當列超過12,但它們的比例爲12時,引導程序佈局會中斷

<div class="row"> 
    <div class="col-md-6"> 
     <h4>Travel/5 April 2015</h4> 
     <h1>Make Some Changes To Do It With Us.</h1> 
     <p> 
      Nullam quis ante. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Cras ultricies mi eu turpis hendrerit fringilla. Praesent nonummy mi in odio. Praesent porttitor, nulla vitae posuere iaculis, arcu nisl dignissim dolor, a pretium mi sem ut ipsum. 
     </p> 
    </div> 
    <div class="col-md-6"> 
     <img class="img-responsive" src="img/posts/1.jpg" alt="post image"> 
    </div> 

    <div class="col-md-6"> 
     <img class="img-responsive" src="img/posts/1.jpg" alt="post image"> 
    </div> 
    <div class="col-md-6"> 
     <h4>Travel/5 April 2015</h4> 
     <h1>Make Some Changes To Do It With Us.</h1> 
     <p> 
      Nullam quis ante. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Cras ultricies mi eu turpis hendrerit fringilla. Praesent nonummy mi in odio. Praesent porttitor, nulla vitae posuere iaculis, arcu nisl dignissim dolor, a pretium mi sem ut ipsum. 
     </p> 
    </div> 


    <div class="col-md-6"> 
     <h4>Travel/5 April 2015</h4> 
     <h1>Make Some Changes To Do It With Us.</h1> 
     <p> 
      Nullam quis ante. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Cras ultricies mi eu turpis hendrerit fringilla. Praesent nonummy mi in odio. Praesent porttitor, nulla vitae posuere iaculis, arcu nisl dignissim dolor, a pretium mi sem ut ipsum. 
     </p> 
    </div> 
    <div class="col-md-6"> 
     <img class="img-responsive" src="img/posts/1.jpg" alt="post image"> 
    </div> 
</div> 
+0

每列後這種情況下,你知不知道[如何引導網格系統工程](http://getbootstrap.com/examples/grid/)? – 2015-04-06 06:43:58

+0

是的,我提到的問題,但請讓我知道如果我缺少什麼。@ Ganesh Salunkhe – 2015-04-06 07:39:59

+0

盡我所知,一行應總col - * - 12這是不正確的在你的情況。 – 2015-04-06 07:43:33

回答

0

最後我今天得到了答案。我的問題的解決方案是使用.clearfix!

在我的情況

,我的佈局被打破了不同高度的每列中,如果我使用

是總結到12