How to position dynamic floating column?

Dear All,


in my recent project i need to display dynamic data..(coming from data base).

div containing these data suppose to come in multiple column if enough width is available..(because UI is of liquid width).

i have assigned float: left do divs needed to come into multiple columns.

and its working fine..but only if blocks in a row r of same height.

suppost float:left creates two columns.
then 1st and 2nd div'll come in a row and 3rd row'll start from next row.

in this case if height of 1st and 2nd div is different then next row will start where height of 1st and 2nd div will end. in this case 2nd row will take extra padding or spacing from top which is not required.

in short i want to create multiple column data presentation which is not needed to come in multiple rows.

i just want equal spacing div to div vertical or horizontal.

to make it in more contrast.

suppose 1st div's height is 100px, 2nd div's height is 70px,

then 3rd div will go under 2nd div(2nd column).

height of 3rd div is 100px.

4th div will com under 1st div(1st column) but its row will start where height of 3rd div will end. so 4th div will have extra spacing of 70px on top with 1st div.

..i think its enough to describe my problem..

it is very critical situation and help is needed in urgent.

thanks in advance.