我正在研究我的博客,当查看时> 1020px wide
看起来像这样,使用三列从左到右加载帖子(即将帖子 1 放在左栏中,帖子 2 放在中间,三个放在右边,然后开始再次从左列):
这很好用,但是当浏览器缩小到布局下方时1020
,布局将转换为单列。这在视觉上很容易通过将列放在彼此下方来实现(看起来不错),但这会导致帖子乱序- 如果总共有 9 个帖子,前三个帖子实际上是帖子 1、4 和 7。
我想保持纯 CSS 托管布局的清洁度,所以我想知道在单个容器(而不是三列)中使用浮动元素的上述三列布局是否有技巧。
我已经玩了一点,只是在每三个瓷砖后向左浮动并清除,但当然最终只是将每三个瓷砖放在上面“行”中最高瓷砖下方的“行”中。