如何使div自动填充可用空间

Question

我有一个html页面：

jsFidlle演示

我希望这些盒子能用相同宽度但高度不同的盒子自动填充可用的空间。

就像谷歌保持中的注释一样

Answer 1

我希望这对你会有帮助。

https://www.sitepoint.com/bootstrap-tabs-play-nice-with-masonry/

这与引导兼容。

Answer 2

您不能让它使用CSS。您必须使用类似于jQuery Masanory的东西

Answer 3

似乎不能达到这个效果，但我会这样做。

<div class="which-ever-class-name"> //surrounding the two divs
<div class="components">Help us find a visionary financier!</div>
<div class="components">Kamusi Here:<br>
Instant translation among the languages in our system (arriving soon at 50+)
<ul>
<li>Chrome extension: ready to ship (pending server)
<li>Mobile app: we need a day or three to join Here! and WordUp!
<li>Facebook Messenger: needs some easy hacks
<li>Other platforms: we've got the back end, just need the implementation horsepower
</ul>
</div>
</div>//end surrounding div

在css中

.components{
  height:100%;
 }

这应该做的是将组件高度设置为填充父级(which-ever-class-name)高度，而父级高度依次由最长的组件设置。