javascript - jQuery Waterfall元素未按其HTML布局顺序排列

晚间。

我正在使用jQuery Waterfall，我相信它是一种基于砌体的pinterest样式网格布局。

我遇到的问题是项目没有按我希望的那样显示。

可以说html标记是这样的：

<div id="buildcontainer">

    <div class='blogresults'>ITEM 1</div>

    <div class='blogresults'>ITEM 2</div>

    <div class='blogresults'>ITEM 3</div>

    <div class='blogresults'>>ITEM 4</div>

</div>

在检查源代码时，这就是标记。但是在我的网站网格中，项目显示为：

ITEM 3 | ITEM 1 | ITEM 4 | ITEM 2

通常，这不是问题，除非我根据其受欢迎程度订购内容。我可以修改它并更改内容的顺序，但是所有内容都是动态加载的。

有什么帮助吗？我可以使用的Waterfall的任何选项。

例如，这是我的网站：

解决了。

订单应为：KTM RC8 |黑色FABIA VRS |黄色VRS |奥迪TT

这是我的商品CSS样式的一种情况吗？这是它的样式：

.blogresults {
border: 0px solid #fff;
background-color: #fff;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 20px;
z-index: 500;
disply: inline-block;
float:;
 -webkit-transition: box-shadow 200ms;
 -moz-transition: box-shadow 200ms;
 -o-transition: box-shadow 200ms;
 -ms-transition: box-shadow 200ms;
 transition: box-shadow 200ms;
}

#buildcontainer {
width: 100%;
height: auto;
    margin-top: 5%;
}

在此先感谢您的帮助！

克雷格

最佳答案

解决了。

问题出在我将物品包装在标签中。将标记移到.blogresults div中，一切正常。