使用php的引導網格

Question

我正在爲我的Omeka網站製作主題，在該網站中我使用PHP調用了一個項目及其各個組件。每個項目都有自己的div，我試圖用Bootstrap創建一個類似tile的網格。但是，div只在一個垂直列中排隊。我如何讓所有的div排成三排或四排？我完全被難住了。它工作正常，沒有PHP（多行和手動添加內容），但不會工作，否則。 This is what it looks like right now。這就是我要的div的樣子：

下面是HTML/PHP：

<?php foreach (loop('items') as $item): ?> 
       <div class="container"> 
        <div class="item"> 
         <div class="row"> 
          <!-- attempt at square grid --> 
          <div class="col-md-3 col-sm-4 col-xs-6 item-item"> 
           <div class="dummy"></div> 
            <div class="thumbnail purple"> 
           Image: <?php $image = $item->Files; ?> 
           <?php if ($image) { 
             echo link_to_item('<div style="background-image: url(' . file_display_url($image[0], 'original') . ');" class="img"></div>'); 
            } else { 
             echo link_to_item('<div style="background-image: url(' . img('defaultImage@2x.jpg') . ');" class="img"></div>'); 
            } 
           ?> 
            Title: <?php echo link_to_item(metadata('item', array('Dublin Core', 'Title')), array('class'=>'permalink')); ?><br> 
            Creator: <?php echo metadata('item', array('Dublin Core', 'Creator')); ?><br> 
            Subject: <?php echo metadata('item', array('Dublin Core', 'Subject')); ?><br> 
            Description: <?php echo metadata('item', array('Dublin Core', 'Description'), array('snippet'=>150)); ?><br> 
            <br> 
           </div> 
          </div> 
         </div> 
        </div><!-- end grid --> 

而CSS：

.dummy { 
    margin-top: 100%; 
} 
.thumbnail { 
    position: absolute; 
    top: 15px; 
    bottom: 0; 
    left: 15px; 
    right: 0; 
    text-align:center; 
    padding-top:calc(50% - 30px); 
} 

.item-item { 
    border: solid black 5px; 
} 

Answer 1

編輯：

我終於發現了一個偉大的答案here。感謝所有的投入！

Answer 2

我給你是一個實現這個的僞方法，利用array_chunk()。

$chunks = array_chunk($array, 4); 
foreach($chunks as $group): ?> 
    <div class="row"> 
     <?php foreach($group as $element): ?> 
      <div class="col-md-3 col-sm-4 col-xs-6 item-item"> 
       <?php // do your php stuff...?> 
      </div> 
     <?php endforeach; ?> 
    </div> 
<?php endforeach; ?> 

Example