Flexbox stack different height childs [duplicate]

Question

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:

And this is where I'm trying to get!!

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.

This is my code: http://jsfiddle.net/822h7ztd

.flexman {
    width:100%;
    padding: .2vw;
    flex-flow: row wrap;
    display: flex;
}
.flexman div {
    background: red;
    width: 100px;
    height:50px;
    margin: .2vw; 
}

Answer 1

For anyone who might have encountered this, seems like what you are looking for is called a Masonry layout, which can be achieved with flexbox this way:

http://thenewcode.com/844/Easy-Masonry-Layout-With-Flexbox