Jquery 砌体额外 space

Question

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

我从 codepen.io

创建了这个 DEMO

如果您访问演示，请调整页面宽度<580px 然后您可以看到有一个额外的 space 我怎样才能删除那个额外的 space 任何人都可以在这方面帮助我？

我将这个 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;
}

Jquery 砌体额外 space

Jquery Masonry extra space

javascript

css

jquery

jquery-masonry