Javascript 重新调整div的范围，使块体尽可能保持方形

情景

我们有一个网站，里面有很多div。div的大小不尽相同，但只能是3种大小中的1种。单击过滤器按钮可以隐藏和显示div。这种隐藏和显示是通过jQuery插件完成的。显示所有块时，如下所示：

复杂化

这些区块有两页。只有在未选择过滤器的情况下才能浏览页面。假设我选择“Filter 1”，Filter 1块显示，其余块隐藏，但现在块看起来像此页面，2块为蓝色：

我需要什么

我需要把积木整理得更好。如果需要的话，它必须沿着一边向下延伸，否则就尽可能地垂直。在这种情况下，最好的解决方案是这样运行：

---

使用javascript/jquery/css可以做到这一点吗？我还需要提到的是，这是一个wordpress网站，它是用自定义Bootstrap3主题构建的。所以所有这些代码都是自定义的。我已经试过了，但是运气不好。如果您有任何帮助，我们将不胜感激。

尝试使用table或flexbox，您将不需要任何插件。如果您使用bootstrap，则有“向右拉动”功能