瀑布流两列排序错乱 后发的文章跑到先发的前面

.list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

按时间倒序的文章用 CSS 多列排成两列，第一列从上往下是最新到第八篇，第二列接着第九篇往下，用户横着读的时候以为第九篇比第一篇新。先别急着动参数，把报错原文和时间点记下来，顺序反了容易白折腾。

原因不复杂，column-count 的填充顺序是先填满第一列再填第二列，DOM 顺序被竖着切开，横向阅读的顺序就乱了。JS 瀑布流按最短列插入，也会把新文章塞到视觉上的第二列中间。

「瀑布流顺序」确认了原因之后，改动尽量只碰那一处，顺手改的东西后面最容易出问题。改动写完就同步给同事，下一个人踩同一个坑，成本还是你的。

处理上按这个顺序：如果阅读顺序重要，别用多列，改成 grid 两列按行排，从左到右依次是第 1 和第 2 篇；一定要瀑布流时，在卡片上标序号或时间，让顺序可辨；分页和追加时保持同一套填充算法，别一半按列一半按行。

改完只确认一件事：从左到右、从上到下读，文章时间严格递减，第一屏第二条不比第一条旧。