Masonry gets horizontalOrder

5 May 2017 · by David DeSandro

I've added Masonry's first new layout feature in years. horizontalOrder for Masonry and Isotope will position items in a Masonry staggered layout, but maintain left-to-right order. Previously, Masonry would discard horizontal order and position items in the closest position to the top. While the first row would have horizontal order: 1, 2, 3; subsequent rows would break the order: 5, 4, 6 ... 9, 7, 8.

Masonry and left-to-right order

Try out the demo on CodePen.

See the Pen Masonry & Isotope horizontalOrder by David DeSandro (@desandro) on CodePen.

This feature has been hotly requested over a long time. For a while, I felt a horizontalOrder feature went against the purpose of Masonry. Masonry is supposed to mess up the horizontal order — that's what makes it Masonry. But recently, I've started relenting over these philosophical stances. If hundreds of people are asking for the same thing, maybe I shouldn't be so stubborn.