0

フロント エンドのベースとして Twitter Boostrap 3 を使用していますが、修正方法がわからないグリッド列を使用して問題が発生しています。

PHP でループを使用してフィードを出力しています。フィードごとにエコーしています。

<? foreach($feed as $post) { ?>
    <div class='col-lg-6'>
        <?= $post ?>
    </div>
<? } ?>

これは、前の投稿またはその前の投稿よりも長い投稿がある場合を除いて、うまく機能します。これにより、右の列が次の行を押し下げるため、左端の列の投稿の間に大量の空白が配置されます。とにかくこれを回避して、列と行を常に並べて並べることはできますか?

4

2 に答える 2

0
<?
$posts=0;
$colums=array();
foreach($feed as $post) 
{ 
$colums[$posts%2] .= '<div>'.$post.'</div>';
$posts++;
} 
?>
<div class='col-lg-6'>
   <?=$colums[0]?>  
</div>
<div class='col-lg-6'>
   <?=$colums[1]?>   
</div>
<?
于 2013-09-06T22:37:51.500 に答える
0

リストとグリッドでは、col-md-6 を繰り返す代わりに、ブートストラップ サムネイルを使用する必要があります。サムネイルはこちら

このコードを使用してください:

<div class="row">
 <? foreach($feed as $post) { ?>
  <div class="col-xs-6 col-md-6">
   <div class="thumbnail">
    <?= $post ?>
   </div>
 </div>
<? } ?>
</div>
于 2013-12-31T10:02:56.607 に答える