jquery - css: ブラウザ内にランダムに配置された画像を含む

Question

ランダムに配置されたすべての画像を 100% ラップ内に含めようとしています。画像はページの読み込み時にランダムに配置されますが、ラップをオーバーフローに設定したため、非表示の一部の画像が切り取られます。画像を重ねずにラップ内にすべての画像を含めることは可能ですか?
ここに jsfiddle があります: http://jsfiddle.net/mdxZL/2/
HTML:

<div id="wrap" style="width: 100%; height: auto; position: absolute; left: 0; top: 0; overflow: hidden;">

<div id="images">
    <img src="http://placekitten.com/200/200" />
    <img src="http://placekitten.com/200/200" />
    <img src="http://placekitten.com/200/200" />
    <img src="http://placekitten.com/200/200" />
    <img src="http://placekitten.com/200/200" />
</div>
</div>

CSS:

    #images
    {
        left: 0; top: 0;
        width: 100%;
    }

    #images img
    {
        padding: 10px;
        position:relative;
}

jQuery:

$(document).ready(function(){
$("#images img").each(
function(intIndex) {

var l = Math.floor(Math.random() * $("#images").width());
var t = Math.floor(Math.random() * $("#images").height());

$(this).css("margin-left", l);
$(this).css("margin-top", t);

}

);
});

Answer 1

試す

#images img
{
    padding: 10px;
    position:relative;
    width:100%;
}