Question

I have a design that has several divs at varying widths/heights and I need them to float essentially to the top left. A simple css float:left will not work because it does not take advantage of the vertical space once it drops to a new line.

I assume I will need to use jQuery to dynamically position each div but I was hoping someone could lead me in the right direction.

This is what a standard float left would do:
standard float http://www.media1designs.com/poc/superfloat/diagram_float_left.gif

This is what I need it to do:
what I need http://www.media1designs.com/poc/superfloat/diagram.gif

The sizes of the divs will change as the website’s content updates so manually entering the positions is not an option.

Answer 1

Have you tried the masonry plugin?