如何从标题中打破列？

Question

我正在使用column-count css但是当单个列分为三列时，它的标题位于第一列，其余列位于另一列

#xmap{
    -moz-column-count: 3;
    -webkit-column-count: 3;
    column-count: 3;
}

demonstration

问题：我可以强行打破标题吗？在我的小提琴中，我希望 headermenu 将它从第一列转移到第二列，仅使用css？（不触及标记）

我还有另一种选择，可以使用nth-child() demo

但这会在footer-menu之上创建空间。我怎么能截断那个空间？

Answer 1

您可以使用

#xmap h2 {
  column-break-after: avoid;
}

和供应商前缀变种。