md-grid-list: re-ordering of items
<p>I am using Angular Material and have been looking at the md-grid-list lately for a design requirement I am trying to solve.</p>

<p>I have a bunch of div's that are children to a container with layout row applied. Each of the child items have set widths\heights and have a toggle button to expand\collapse, which just doubles their sizes on expand and then return to original sizes on collapse.</p>

<p>What I'd like is for the child items to re-order to fill available space (provided that space is big enough) around other items that have been expanded.</p>

<p><a href="https://i.stack.imgur.com/dmJIR.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/dmJIR.png" alt="enter image description here"></a></p>

<p>Right now the container element for my child items also has layout-wrap applied and so of course as items gets expanded, any children that don't fit horizontally just push down below the previous item.</p>

<p>I have come across md-grid-list but I am not so sure this will provide me with what I am after,  as it seems to be more suited for percentage based sizes - or have I got that wrong? </p>

<p>I have seen <a href="http://masonry.desandro.com/" rel="nofollow noreferrer">http://masonry.desandro.com/</a> where if you resize the window on the homepage, that's the kind of behaviour I am looking for, although I would not want the height\widths to update dynamically.</p>

<p>Can this behaviour be achieved using Angular Material components alone?</p>