javascript - 将所有子 div 彼此靠近

Question

我正在使用 Bootstrap 。在循环内加载 div，其中包含一些可短可长的数据。

我观察到以下问题:
Unwanted space here

图像显示了 div 之间一些未使用/不需要的空间。

由于有不同高度的 div，如何才能克服这个问题并将每个子 div 粘到其他的壁橱中？

下面的代码是循环运行的，

HTML 结构:

<div class="container-fluid">
 <div class="col-lg-12">
  <div class="row">
    //loop begins
    <div class="col-md-4">
      <div class="panel panel-default">
        <div class="panel-body">
           //Some short or very long content here .
        </div>
      </div>
    <div>
    //loop ends
  </div>
 </div>
</div>

我的学习:

Floating DIV's to fill unused space

尝试过但对我不起作用。

一些技巧:

当所有子 div 的高度都相同时，不会发生这种问题。

在我的例子中，为子 div(s) 设置固定高度不是解决方案。

任何人都可以指导我吗？可能是一些文章？

Answer 1

解决这个问题的更好方法是你必须添加

 read more

如果div中的文本内容比另一个div长，则放入div。当用户点击

read more

您可以使用 Bootstrap 模式弹出 div 并显示其中的所有文本内容。