Jquery 引导/砌体柱宽度问题

我将每个列都设置为col-xs-4，但它会出错并删除第三列。我的代码如下：

$(document).ready(function () {
var $container = $('.products');

$container.imagesLoaded(function () {
    $container.fadeIn(300);
    $container.masonry({
        itemSelector: '.product_image',
        isAnimated: true
    });
});
});

<div class="product_image col-xs-4"><img class="img-responsive img-rounded" src="/photos/1014919_10101744331352953_8981394028326535000_o.jpg"></div>

我的html是这样的：

$(document).ready(function () {
var $container = $('.products');

$container.imagesLoaded(function () {
    $container.fadeIn(300);
    $container.masonry({
        itemSelector: '.product_image',
        isAnimated: true
    });
});
});

<div class="product_image col-xs-4"><img class="img-responsive img-rounded" src="/photos/1014919_10101744331352953_8981394028326535000_o.jpg"></div>

---

为什么要使用

位置：绝对值

？这是错误的方法，在引导中嵌套col总是像这样使用

“row”

<div class="col-xs-12">
  <div class="row">
     <div class="col-xs-4"></div>
     <div class="col-xs-4"></div>
     <div class="col-xs-4"></div>
  </div>
</div>

---

但是，在col-xs-4中，您的移动屏幕将再次划分为3列，因此更喜欢使用

col-md-4 col-sm4 col-xs-12

为什么容器的位置绝对采用内联样式？这是砌体对其所做的事情。我应用的不是CSS，而是砖石对它的作用。我应用的不是CSS。