CSS div对齐就像一个谜题

Question

我正在尝试将这些divs togethor像拼图一样。我想在div 1和3之间对齐div 4.截至目前div 4从div 3开始。解决方案是什么，以便div“插入”彼此。

<div style='overflow:hidden;width:500px;'>
            <div style='float:left;width:200px;height:400px;border:1px solid #707070'>1</div>
            <div style='float:left;width:200px;height:300px;border:1px solid #707070'>2</div>
            <div style='float:left;width:200px;height:400px;border:1px solid #707070'>3</div>
            <div style='float:left;width:200px;height:300px;border:1px solid #707070'>4</div>
            </div>

我不想使用绝对位置。这只是一个例子。真正的代码处于循环中，内容大小是动态的。

Answer 1

JQuery Masorny。仅CSS不足以动态地执行此操作。