在列中均匀分布元素

我有一个名为div的.wrap项目.未知数量的项目(.thing)应排列成四列(彼此堆叠).

    
 thing1 
    
 thing2 
    ...

列需要均匀分布,以便没有列为空.这很容易使用:

.wrap {
    column-count: 4;
    column-fill: balance;
}

但是,column-fill我相信,只适用于Firefox.

是否有另一种CSS方法可以在所有最新版本的浏览器中实现此布局？具体来说,flexbox能够在这里提供帮助吗？

请注意,我不能添加额外的div作为列,并且不需要JS解决方案.

这是一个小提琴,除了偶数分布之外还有所需的布局→ http://jsfiddle.net/bpdtkmmt/