嵌套砌体对象

我正在尝试使用容器创建图形视图。因此，如果： [A's -> B's -> C's] 视图将显示 Bs 内的对象 c，而 Bs 又在 As 内。

Something like this:

我认为砌体视图非常适合此目的，但我无法使嵌套正常工作。

到目前为止我所拥有的小提琴：http://jsfiddle.net/paulocoelho/5SxQ5/4/ http://jsfiddle.net/paulocoelho/5SxQ5/4/

我不明白他们为什么不排队。我还尝试使用 CSS 列计数和列间隙，但发现渲染非常错误。

小提琴代码因为我必须...

var $container = $('.container');
$container.masonry({
    /*columnWidth: 200,*/
    itemSelector: '.eWrapper'
});

考虑一下这一点。

Remove itemSelector属性 - 如果已设置Masonry不仅会使用子项，还会使用与该选择器匹配的所有后代。因此，对于第一个容器（motherContainer) Masonry会尝试布局所有.wrapper元素，包括嵌套的元素.container元素。

还有关键点——调用Masonry在恢复的数组上.container元素。从最里面到最外面，因为 Masonry 改变了子元素的高度，在父容器中留下了间隙。

var $container = $('.container');
$($container.get().reverse()).masonry({});

尝试一下吧。这里有一个jsfiddle http://jsfiddle.net/5SxQ5/7/。 我还添加了 C 元素。