Responsive Pure CSS Masonry Layout

Responsive Pure CSS Masonry Layout
Responsive column masonry layout with CSS column count.
Masonry layouts have been around a long time. You'll most likely recognize its use on Pinterest. In fact, Pinterest so popularized the use of this layout that it’s also known as the “Pinterest style layout”.
While a simple layout in theory (“maybe we can just use floats?”), CSS does not actually make this easy to implement. Using floats will not reduce the spaces between differently sized items. Instead you will end up with something along the lines of this:
codepen
See the Pen Responsive Pure CSS Masonry Layout - Column Count by Stephanie (@ramenhog) on CodePen.