Html 如何将块放置在另一块下

我该怎么做才能使不同高度的块按规则间距隔开

例如，下图中的块2应位于块1的正下方

---

您可以将页面分成左浮动列，然后用普通div填充每列

*{/*重置所有内容*/
保证金：0；
填充：0；
框大小：边框框；
}
身体{
字体系列：无衬线；
}
#包装{/*固定宽度内容区*/
宽度：800px；/*如果愿意，将其设置为百分比*/
保证金：20px自动；
}
.column{/*这就是神奇发生的地方*/
float:left；/*列并排显示*/
宽度：50%；/*这是一个两列布局*/
填充：0 1%；/*由于边框框，填充不会破坏布局*/
}
氢{
垫底：2%；
}
.content{/*这是每个列中的分幅*/
填充：4%；
利润底部：4%；
边框：5px实心#c4dcd5；
背景#f8f9f2；
}
p{/*它们进入内容块内部*/
垫底：1%；
}

开胃菜
丸子

鱼苗

小船

沙拉
凯撒沙拉

菠菜沙拉

微型棉花糖果冻沙拉

饮料
可乐

水

牛奶

三明治
鲁本

BLT

黄瓜和豆瓣菜

奶酪

炸豆腐

热黄油三明治

甜点
冰激凌

太妃糖

小船

棒子上的糖

油炸巧克力棒

蜜饯蟋蟀

可能重复的如果可能的话，我想不使用JS，你能发布你的html和css吗？