使用Masonry显示Instafeed图片

我在工作室的当前网站上实现了Instafeed，以两行图像显示我们的Instagram订阅源。自从我们允许通过API提供肖像和风景照片以来，我们一直在顶部和底部之间获得间隙，因为有些图像会比其他图像更短。

我们目前正在尝试实施砖石结构，以使最底层的一排与顶部堆叠，并摆脱那些尴尬的空间，但我们很难让整个东西发挥作用。

理论上，这应该做到：

HTML：

<div id="instafeed">
<!-- width of .grid-sizer used for columnWidth -->
<div class="grid-sizer"></div>
<a><!--- these are the a attributes populated by Instafeed --></a>
<a><!--- these are the a attributes populated by Instafeed --></a>
<a><!--- these are the a attributes populated by Instafeed --></a>
...
</div>

CSS：

.grid-sizer {width:16%}
#instafeed {width:100%;margin-bottom:-.8%}
#instafeed a {width:16%;margin:0 0 .8% .8%;float:left}
#instafeed>:first-child,#instafeed>:nth-child(6n+7) {margin-left:0;clear:left;}
#instafeed a img {width:100%;height:auto;zoom:1;box-shadow:#000 0 0 0;opacity:1;-moz-transition:all .5s ease;-webkit-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}
#instafeed a img:hover {zoom:1;opacity:.5}

Javascript：

$('#instafeed').masonry({
// set itemSelector so .grid-sizer is not used in layout
itemSelector: '#instafeed a',
// use element for option
columnWidth: '.grid-sizer',
percentPosition: true
})

理论上这应该是可行的，但当我插上电源时，照片不仅不会堆叠在自己身上，而且其中一张通常会掉到第二排，网站的底部会完全塌陷。

任何帮助都将是惊人的！