上校應該倒塌並左浮動

Question

我有以下設置（我知道這不是最好看，但它服務於案件）。我有多個col-md-4標籤。一旦左邊的高度大於其他的高度，第二行的高度在中間，但它應該在TestTT ...字符串的第一個下面。

https://www.bootply.com/HJbiqZXmkE

的事情是，我通過多次使用的東西和AngularJS與循環ngFor，所以第三個後，我不能靜態地添加行標籤，因爲我不知道有多少會顯示。

Answer 1

當你在循環中迭代div時，它採用默認的CSS。包含div是不平衡的，由於這有bootstrap調整自己，顯示你最好的結果，這是有意的。你必須爲你的div設置明確的高度，這可能會讓你的響應速度變得很慢，你可能不得不用自定義CSS來編寫@media代碼。既然你想使用4個空間，而不使用行，你可以這樣做

<div class="col-md-4 customCss">Content1</div> 
<div class="col-md-4 customCss">Content2</div> 
<div class="col-md-4 customCss">Content3</div> 
<div class="col-md-4 customCss">Content4</div> 

在CSS

.customCss{ 
    min-height:50px;// you desirable properties 
} 

修訂

我用PHP做的，你可以實現用你在角

假設$行語言是我的數組

<?php $rows = array(array('id'=>'a'), array('id'=>'b'),array('id'=>'c'), array('id'=>'d'),array('id'=>'e')); 
    $i=0; // counter 
    foreach ($rows as $row){ 
    if ($i%3==0) { // if counter is multiple of 3 ?> 
     <div class="row"> 
    <?php } ?> 
     <div class="col-md-4"> 
     Content 
     </div>   
    <?php $i++; ?> 
    <?php if($i%3==0) { // if counter is multiple of 3 ?> 
     </div> 
    <?php } ?> 
<?php } ?> 
<?php if($i%3!=0) { // put closing div if loop is not exactly a multiple of 3 ?> 
     </div> 
    <?php } ?> 

讓我知道如果你沒有得到