Three divs, content from one div goes to another

I need to create three divs, next to each other (attribute float:left). Then I read the data from database and I 开发者_开发知识库need to present this data in three divs, in such a way that I first fill up the first div, line by line and when I reach certain height, I go to the next div and fill it with data, and so on. This is something like reverse table, that is I first fill the first column in first row then go to second and so on until the end of the row, then I move to the second column of first row and so on. I hope you get the picture.

Is there a way to achieve this in CSS or in some other way?

This functionality is available in CSS3 using column-count and column-span.

I do not know how to make it efficient, but it should be possible with javascript... you know the line-height, you check the height of first div with all content, then you truncate it to desired size and the rest put to the next div.. repeat.. but this looks odd.. ?

You might be able to do this by requesting the first 30 results in the database in one column, then request the next 30 in the next div, and so on. I can't see it being possible in CSS 2.1 alone.