[Solved] Display Divs one below the other [closed]

by


You need CSS column layout. Something like this:

#parent {
    width: 100%;
    height: 500px;
    background: #eee;

    -moz-column-count: 3;
    -moz-column-gap: 20px;
    -webkit-column-count: 3;
    -webkit-column-gap: 20px;
}
#parent .box {
    width: 250px;
    height: 80px;
    background: #AAA;
    margin-bottom: 10px;
    display: inline-block;
}

Demo: http://jsfiddle.net/J8A24/

Support: browser support chart.
Further reading: Multiple Columns

For IE you may want to use one of the many polyfills or leave it as is, inline-blocks will gracefully degrade for IE.

1

solved Display Divs one below the other [closed]