0

I'd like to achieve an overview page with multiple panels automatically lining up one after another. My current result can be seen on this image: enter image description here

What I need to achieve is that the third, bottom left panel jumps up and aligns right after the first one. Unfortunately I do not want to nest the page into two columns because on smaller screens the size and arrangement of the panels changes. Also other panels lower on the page might have different sizes than those seen here (i.e. 8:4).

Is there any simple solution? Thank you!

Darkry
  • 590
  • 2
  • 12
  • 26
  • You should know by now, to have a more complete question, containing a minimal code sample, preferable as a working snippet, and not just a screen dump. – Asons Mar 20 '16 at 11:38

1 Answers1

0

There isn't really a simple way unless you can force all the panels to be the same height. Here are a few other options..

Use CSS3 column-width.. http://www.bootply.com/123350

Or, using Bootstrap with the Masonry plugin... http://www.bootply.com/123353

Carol Skelly
  • 351,302
  • 90
  • 710
  • 624