HTML砌体布局问题（asp.net）

Question

对于我的网站，我试图将砌体包含在内容中以便很好地布置内容，但到目前为止，我得到了非常奇怪的结果。这是我的代码：

<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3 well well-sm news-box" style="background-color:@color" 
     data-masonry='{ "columnWidth": ".masonry-container", "itemSelector": ".masonry-container" }'>
    <div class="masonry-container">
        <div class="contain">
            <img src="@w.Image" class="image img-responsive" />
            <div class="middle">
                @getReferrals(w.Id)
            </div>
        </div>
        <h4>@w.Title</h4>
        <p>@w.Body</p>
    </div>
</div>

正如您所见，外层是具有砖石质量的外层。我没有使用jquery因为我无法使它工作，HTML至少给了我（错误的）结果。无论如何，结果是这个神圣的混乱：

其他内容：此内容位于引导标签内。我在它们之外进行了测试，它工作得很好，但在它里面给了我一些问题。

如果可以，请帮助我！提前谢谢....

Answer 1

每当使用砌体时，只需确保将规则放在行级别并瞄准列，否则布局将是奇数。