如何在一個循環中生成溢出的行

我需要圖片出現在多行中。問題是我必須在一個大循環中完成所有操作，並使用overflow：auto。無論如何對我來說這樣做？下面是代碼：如何在一個循環中生成溢出的行

<div class="horizontal2"> 
       <ul> 
       <li> 
        <?php for ($i=0; $i <60; $i++): ?>        
        {{ user:profile }} 
         <img class="picformatting" src="{{ profile_picture:image }}" /> 
        {{ /user:profile }}         
        <?php endfor;?> 
       </li> 
       </ul> 
      </div>

這裏是CSS（horizontal2）：

.horizontal2{ 
    list-style: none; 
    width: 100%; 
    overflow: auto; 
    padding-left: 0; 

}

來源

2013-02-11 Jonfor

你試過浮動圖像？ – Jrod 2013-02-11 17:37:56

picformatting類的css是什麼？嘗試將圖像浮動到右側並進行顯示：內聯。 – Husman 2013-02-11 17:40:46

怎麼樣：

<?php 
$max_img = 10; 
?> 
<?php for ($i=0; $i <60; $i++): ?> 
    {{ user:profile }} 
     <img class="picformatting" src="{{ profile_picture:image }}" /> 
     <?php if(fmod($i, $max_img) == 0) echo "<br/>"; ?> 
    {{ /user:profile }}         
<?php endfor;?>

當然

，它不是在自動模式，但可以是一個「解決方案」 ......

來源

2013-02-11 18:09:15 Stv

li#container { 
    width:400px; 
    height:auto; 
} 
li#container img { 
    display:inline-block; 
    width:37px; 
    height:37px; 
    margin:3px; 
}

您可以只使用display:inline-block屬性。它會進行調整，如果超過10張圖像在行，那麼它會強制執行到另一行。

來源

2013-02-11 17:40:15

如何在一個循環中生成溢出的行

回答

相關問題