Is it possible to flow children divs and make them fill an main div using horizontal overflow?

Question

i started to think about this right now, and i'm thinking if it's possible to achieve just using css, or in need of javascript.

I got an image showing the example here:

Anyone have seen something like this before? Can show me some examples?

Answer 1

you can achieve this effect with a table. as you add items just append a new cell. to have items slight to the left or right just position relative; and left: -some px.

.table {
    display:table;
}
.table > div {
    display:table-row;
}
.table > div > div {
    display:table-cell;
    padding:2px;
    vertical-align:top;
}

demo toy/fiddle *uses jquery for demo but real work is done in css.