利润空间不大

Question

我正在研究一些由正方形制作的布局，它们的宽度由百分比和高度定义，填充方法与1：1方面的宽度相同，并使用jQuery Masonry进行定位。问题是有些像边缘开始出现，没有设置填充或边距，但重新调整窗口后它们消失了，这里是小提琴：

https://jsfiddle.net/uvrcpuag/3/embedded/result/

<div id="container">
    <div class="square"></div>
    <div class="square"></div>
    <div class="square"></div>
</div>

.square {
    width: 16.666666666666666666666666666667%;
    padding-bottom: 16.666666666666666666666666666667%;
    background-color: #000;
    position: relative;
    float: left;
}

Answer 1

尝试手动触发resize()，例如

$(document).ready(function () {
    var msnry = new Masonry('#container', {
        itemSelector: '.square'
    }).resize();  // call resize()  
});

Demo