我正在尝试在http://www.gablabelle.com/创建网格布局。
我有多个带有浮动的div（图像）：left; 财产，我想知道为什么有一些空白以及为什么浮动 div 没有填补空白。
非常感谢您的时间和帮助。
更新：我现在使用 jQuery 同位素，但仍有差距……知道吗？
问问题
9792 次
3 回答
4
这就是浮动的工作原理。这些间隙之所以存在，是因为元素在一个又一个换行后浮动。它没有填满上面的空间。
如果您想要不均匀的网格效果，那么您需要使用 JavaScript 解决方案来设置绝对位置。我推荐masonry plugin，我认为主页上的 before/after 示例显示了您遇到的问题和您想要的解决方案。
于 2012-08-04T23:18:16.347 回答
2
您似乎正在寻找一种方法来填充页面上的所有方块。简单地通过 CSS 是不可能的。'向左飘浮;' 只是简单地填充页面中的空间，一个个图像，而不是考虑它们是如何组合在一起的。
将所有部件组装在一起，让它们像拼图一样舒适地坐着并不容易。这实际上是一个相当复杂的问题，它与背包问题（http://en.wikipedia.org/wiki/Knapsack_problem）和包装问题（http://en.wikipedia.org/wiki/Packing_problem）有关.
为了解决这个问题，我确信会有 jQuery 或 JavaScript（甚至可能是 PHP）库可供使用。或者，您可以手动排序照片，使它们以整齐的方式组合在一起。
祝你好运！
于 2012-08-04T23:20:26.353 回答
0
这导致了差距：
article.post {
margin: 0 0 30px 30px;
}
于 2012-08-04T23:13:08.577 回答