CSSで複数のサイズのフローティングイメージ

Question

私は、ユーザーからアップロードされたものに基づいてフローティングイメージのバナーを作成したいと考えています。ツールは50x50と100x100のイメージを持つ必要があります。現時点では、画像をランダムに表示し、float：leftを適用しようとしました。しかし、あなたが以下に見るように、それはギャップを残す。

プログラムで画像を配置することなく簡単に行う方法はありますか？

あなたがこれまでのコードをしたい場合は、それはここにある：

.wall { 
    width: 300px; 
    background-color: red; 
    display: table; 
} 

.wall img { 

    float: left; 

} 

と

<div class="wall"> 
    <img src="man1.png" alt=""/> 
    <!-- ETC... !--> 
</div> 

Answer 1

私はあなたには、いくつかのコードを記述する必要があると思います。最初に気づくのは、ギャップがすべて50x50（最小）の画像で塗りつぶされることです。私は以下を実装しようとします：

1. ランダムに50x50画像でページを塗りつぶします。
2. 100x100の画像を絶対に配置します。これらは、基礎となる4つの100x100画像をカバーします。

このように思えますが、うまくいけばそれが役に立ちます。

ボブ