Html CSS：使div位于与其顶部div底线相关的顶部（仅CSS）

我有困难解释我需要什么，所以我包括这张图片。我需要像这样的东西

---

我知道我可以用插件得到这个。我想知道这是否只有在css（也适用于IE8）的情况下才可能实现。

我已经为您的答案找到了解决方案

检查此链接：

p{margin:0；padding:0}
.网格容器{
宽度：100%；
文本对齐：居中；
边缘顶部：15px；
}
.第三{
显示：内联表；
宽度：30%；
}
.电网{
边框：1px纯黑；
利润率：10px0；
}
.grid1{
高度：200px；
背景：ddd；
}
.grid2{
高度：100px；
背景#3434ff；
}
.grid3{
高度：100px；
背景#3434ff；
}
.grid4{
高度：350px；
背景：#ff0f00；
}
.grid5{
高度：200px；
背景：#ccc；
}
.grid6{
高度：200px；
背景#3434ff；
}

网格1

网格2

网格3

网格4

网格5

网格6

Google搜索术语“砖石”。上一次我尝试使用纯CSS时，效果并不理想。定位有多具体？您想垂直还是水平填充这些部分。@比尔：((（我已经发现了，我不想使用插件。顺便说一句，谢谢。@88 MPG我希望它水平放置，彼此分开。使用垂直放置将easy@BillCriswell的答案是正确的，我想补充一点，同位素也是一个很好的选择。你不能用纯css来做这件事，除非垂直阅读。这个链接给出了404ERror.另外，我不需要垂直分组。顺便说一句，谢谢！再次检查，我更改了链接，这就是您注意到错误404的原因。现在它应该再次出现。div是垂直分组的。如果您检查html代码的结构，您会注意到div带有类“third”对内部元素进行垂直分组。谢谢你的回答，但是垂直分组会使动态加载功能复杂化，所以我选择了砌体插件