Javascript 首先使用不同高度和行填充的引导栅格视图

我有一个不同高度网格的视图。 我的html代码是这样的

<div class="grid-container">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
<div>9</div>
</div>

它正在将视图渲染为

但我想把它当作

我尝试过col md类，但它使所有网格大小相等，但我希望高度不相等。

---

我的整个html div都是javascript动态的

我不确定你是否可以只用bootstrap就可以做到，你可能需要处理JS和砌体。我希望这个链接有用

.grid-container{
-moz-column-count: 3;
-moz-column-gap: 10px;
-webkit-column-count: 3;
-webkit-column-gap: 10px;
column-count: 3;
column-gap: 10px;
}