砌体给容器0高度

我正在研究一些涉及响应式砌体布局的东西。 我有一个容器，其最大宽度为960px但随着浏览器缩小。 我的网格项目具有基于百分比的宽度（100％，66.666666etc％，33.33333etc％）。 出于某种原因，当我将一个函数传递给columnWidth选项时，它总是给容器一个高度为0.这就是我实例化Masonry的方式。

 $(window).load(function() { var $container; $container = $("#grid_container"); $container.masonry({ columnWidth: function(containerWidth) { return containerWidth / 3; }, itemSelector: ".grid_item", isFitWidth: true, isResizable: true, gutter: 10 }); }); 

知道为什么会这样做吗？ 因为我使用$(window).load它应该能够计算高度。 我错过了一些非常明显的东西吗？ 是否根本不可能使用百分比列宽与砌体？

Answer 1

在Masonry中，函数类型不是columnWidth属性的允许值。

请尝试改为：

1. 传递CSS选择器（例如， .grid_box ）作为columnWidth属性。
2. 在CSS中，将选择器添加到其父容器的适当百分比宽度（例如.grid_box{ width: 20%; } ）。
3. 对于HTML，将空

   到容器中。