html - 将 div 定位在彼此下方

Question

假设我在一个父 div 中有 6 个 div，如果我使用 inline-block 它会像这样显示

但我想让他们两个像这样出现。

Answer 1

这叫做 mansory ，检查这些可能对你有帮助:

http://masonry.desandro.com/

http://desandro.github.io/masonry/

不需要提供代码，因为这个问题已经在这里问了很多次了，我只是给你一个搜索的关键。

这也可能有帮助:

http://jsfiddle.net/prollygeek/hP6fS/

side1=0,side2=0
$(".flexbox").children().each(function(index, element) {
if(side1<=side2)
{
$(this).css("top",side1+"px") 
side1+=parseInt($(this).css("height"))
}
else if(side2<side1)
{
$(this).css("top",side2+"px")
$(this).css("left","50%") 
side2+=parseInt($(this).css("height"))
}

});