如果有 space 就推 div 阻塞？

Question

Hora，我想到了一个包含多天条目的日历。如果有多个条目重叠，如果有足够的space，它们应该自动跳到一行。如何做到这一点？这可能只需要很少的 javascript 吗？

像这样的日历： calender image

Answer 1

我假设您正在使用 div 块来显示日历中每一天的单元格。如果您在单元格上同时使用 display: flex; 和 flex-direction: column;，则可以使用 order 属性.

来确定其子项（您的条目）的显示顺序

如果您在属于 multi-day（重叠）条目的条目上设置 class 和 order: 1;，这些条目将显示在您的单元格顶部。

您可以在 this article 中阅读有关订购弹性商品的更多信息。