Bootstrap 3和砌体

Question

使用 Bootstrap 3 和 Masonry ，我想要显示我的8张照片：

期望的结果：

为此，我写了这段代码：

HTML代码：

<div class="row">

        <div class="items">

            <div class="item col-md-3">
                <img src="...." alt="...">
            </div>
            <div class="item col-md-3">
                <img src="...." alt="...">
            </div>
            <div class="item col-md-3">
                <img src="...." alt="...">
            </div>
            <div class="item col-md-3">
                <img src="...." alt="...">
            </div>
            <div class="item col-md-3">
                <img src="...." alt="...">
            </div>
            <div class="item col-md-3">
                <img src="...." alt="...">
            </div>
            <div class="item col-md-3">
                <img src="...." alt="...">
            </div>
            <div class="item col-md-3">
                <img src="...." alt="...">
            </div>

     </div>
</div>

jQuery代码：

var $container = $('.items');

$container.imagesLoaded( function() {

  $container.masnory({
    columnWidth: '.item',
    itemSelector: '.item'
  });

});

但我得到了这个结果：

为什么照片不合规？怎么能使这个工作？

任何建议都会有所帮助。感谢