September 18, 2012
How to stack up a list of divs so there's no vertical gap?
Question by Prabhu
If I have a list (ul/li) of divs (with variable height), is there a way to stack them so that there are no gaps between a div and the div below it? Like the pinterest UI…
<ul>
<li>
<div>...</div>
</li>
<li>
<div>...</div>
</li>
...
</ul>
ul
{
list-style-type:none;
vertical-align:top;
}
li
{
list-style:none;
vertical-align:top;
display:inline-block;
}
This is similar to the question here How to make div stack first vertically then horizontally? except that I still want to order it like this:
1 2 3
4 5