Home/ Questions/Q 7533435
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T05:43:29+00:00

I currently have a bunch of inline-block div s stacked up horizontally. When the

  • 0

I currently have a bunch of inline-block divs stacked up horizontally. When the container is full, they spill over nicely into the next row:
enter image description here

Is it possible to do the same thing vertically, without changing the HTML?
enter image description here

To generate this picture, I had to move each column into a container div. I can’t modify the source HTML, so this isn’t an option.

CSSDesk

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    CSS2
    Alas, to my knowledge this is not possible with pure CSS and HTML. I do know there is a jQuery plugin Masonry that does this quite nicely though.

    CSS3
    Using CSS3’s Multi-column Layout Mode you can achieve the question’s layout (though it won’t have as many options as abovementioned masonry). IE support is from 10 and up I think, and you may need some browser prefixes. The non-prefixed version would look something like this (on your container):

    column-count: 3;
column-gap: 10px;
width: 480px;

    The above was adapted from this blogpost that links to this demo (though there are others too).

    • 0