Using random images from a database to fill the entire height and width of a web page

Question

I would try to pull the X-number of images from my DB from 100 +/- images, and I would like to take the whole page in the upper left corner to the lower right corner

still i got it

<? $images .= "<img src='".$image."' width='64' height='64' style="float:left;"/>";?> <div style="position: absolute; top:0px; left:0px;" ><?=$images;?></div> 

But this code does not fill all the way to the right and bottom

Answer 1

This is an NP-Hard issue. What you want is a greedy algorithm that fills every line of your screen with a random image when the limit value limits only the screen width. I wrote a solution for packaging bottles for this problem. You can download my bin-packing package at phpclasses.org.

Answer 2

I would take a look at jQuery Masonry . He has the ability to fill the page by moving div containers around to build a wall (as the masonry suggests). I think that you are going to, at least if they are all not 64 / 6x pixels (allows you to be flexible with image sizes).

Demo can be found here.

Otherwise, you can simply make each element appear in a line and allow the browser to fill the area.