title: Responsive Masonry jQuery layout example
body: <p>Can anyone suggest how this site uses the jQuery Masonry plugin for its responsive, fluid layout?</p>
  
  <p><a href="http://tympanus.net/codrops/collective/collective-2/" rel="noreferrer">http://tympanus.net/codrops/collective/collective-2/</a></p>
  
  <p>Specifically;</p>
  
  <p>The number of columns changes from 3 to 2 to 1 on browser resize which is what you expect from a site using masonry, but what's interesting is the columns also resize to always fill the full width available. Most other Masonry sites I've seen leave gaps to the right of the columns as the number of columns changes (e.g <a href="http://masonry.desandro.com/" rel="noreferrer">http://masonry.desandro.com/</a>) OR the columns fill the full width but the number fo columns stays the same (<a href="http://masonry.desandro.com/demos/fluid.html" rel="noreferrer">http://masonry.desandro.com/demos/fluid.html</a>). Are they dynamically setting the number of columns on browser resize combined with CSS media queries or maybe they're using CSS3 columns?</p>
  
  <p>Thanks.</p>