javascript - 在可变高度的网格中使用 float

Question

我有以下网格，每个红色 block 都是一个 div。如您所见，最长的 div 将底部的两个 div 压低，从而产生了不需要的空间。

这是我想要的方式，这样空间更紧凑，不会被最长的 div 打破:

是否有 CSS 解决方案，或者 Masonry/Isotope 的替代方案？

Answer 1

没有办法使用 float 来完成您想要的。但是，您可以使用:

div{
position:absolute;
} 

这将实现您想要的效果，因为它允许您将每个框精确定位到您想要的位置，精确到像素。请注意，这将从文档流中删除每个 div。出于这个原因和其他一些原因，我建议将 div 限制在某种容器中，该容器设置为:

position: relative;

这样会限制绝对定位的范围。