Question

我有一些div左侧浮动，如果你看到附加的jsfiddle，你会看到我想要做什么，在小提琴中有一个黄色的盒子，我需要这个与绿色框的底部齐平只有我不确定这是否可能？

是吗？如果是这样我怎么能这样做？提前致谢！

Answer 1

尝试 this jsFiddle 之类的内容。从技术上讲，你甚至将.box个项目向右移动而不是向左移动，然后根据其内容获得自填列。所以，在CSS中添加：

.box:nth-child(odd) {clear: left}
.box:nth-child(even) {float: right; clear: right}

更新

如果你有超过这些特定的块，显然这个解决方案不会很好用。所以，jQuery Masonry可能是获得良好结果的唯一途径。

Answer 2

您必须添加两个div，float: left作为列。

请参阅： http://jsfiddle.net/K5zjc/5/

<div style="width:200px;">
    <div class="boxContainer">
        <div class="box green">
            <ul><li>Item</li></ul>
        </div>
        <div class="box yellow">
            <ul><li>Item</li><li>Item</li></ul>
        </div>
    </div>
    <div class="boxContainer">
        <div class="box red">
            <ul><li>Item</li><li>Item</li><li>Item</li><li>Item</li></ul>
        </div>
        <div class="box cyan">
            <ul><li>Item</li><li>Item</li></ul>
        </div>
    </div>
</div>

CSS Stacked divs

2 个答案: