Jquery Masonry 额外空间

Question

我正在尝试使用 JQUERY Masonry 制作图像网格系统，但我遇到了空间问题。

我从 codepen.io 创建了这个 DEMO

如果您访问演示，请调整页面宽度

我用这个 javascript 做砌体选择器

$(document).ready(function() {
  $('.image-container').masonry({
   isFitWidth: true,
   itemSelector: '.user-image'
  }).imagesLoaded(function() {
   $('.image-container').masonry('reload');
  });
});

Answer 1

这是按预期工作的。

我对您的建议是删除图像容器上的浮动。这个 IMO 为您提供了您应该期待 Masonry 的演示。

代码：

.image-container {
/* float:left; */
  position:relative;
  max-width:580px;
  display: block;
  margin: 0 auto;
  padding-left:3px;
}