Image mosaic with html/css fill the space

I'm trying to make an "image mosaic" that consists mostly of images of the same size, and some of them the double height.

They all should align neatly like this:

enter image description here

But still like this: enter image description here

I know is more "easy" do this with divs and "float:left" but i have to do with list.

Someone had i idea how can i fix this?!