title: Flexbox stack different height childs
body: <p>I'm building an image portfolio site, and I need the images to stack depending on their variable size. This is what I have achieved with flexbox so far:</p>
  
  <p><a href="https://i.stack.imgur.com/X6nhK.png" rel="noreferrer"><img src="https://i.stack.imgur.com/X6nhK.png" alt="enter image description here"></a></p>
  
  <p>And this is where I'm trying to get!! </p>
  
  <p><a href="https://i.stack.imgur.com/G1Dmk.png" rel="noreferrer"><img src="https://i.stack.imgur.com/G1Dmk.png" alt="enter image description here"></a></p>
  
  <p>Does someone know how to make children stack this way on a flexbox display? I swear I can't find this particular structure anywhere on flexbox tutorials, though I've seen it several times on tumblr blog displays.</p>
  
  <p>This is my code:
  <a href="http://jsfiddle.net/822h7ztd" rel="noreferrer">http://jsfiddle.net/822h7ztd</a></p>
  
  <pre><code>.flexman {
      width:100%;
      padding: .2vw;
      flex-flow: row wrap;
      display: flex;
  }
  .flexman div {
      background: red;
      width: 100px;
      height:50px;
      margin: .2vw; 
  }
  </code></pre>