相关疑难解决方法(0)

使用两列flexbox布局,如何使不同大小的子项填充所有可用空间,而不是所有具有该行最高子级高度的子项？

我在jsbin上设置了一个说明问题的演示.我希望所有的孩子都能达到包装内容的大小.

#container {

 width: 800px;
  display: flex;
  flex-wrap: wrap;
}

.cell {
  width: 300px;
  flex; 1 auto;
}


<div id="container">

<div class="cell">
Cells with arbitrarily long content.</div>

<div class="cell">
</div>

<div class="cell">
</div>

<div class="cell">
</div>

<div class="cell">
</div>

</div>

</body>
</html>