CSS3 中是否有 column-min-width 和 column-max-count？答案

【问题标题】：Is there a column-min-width and column-max-count in CSS3?CSS3 中是否有 column-min-width 和 column-max-count？
【发布时间】：2015-05-01 04:41:50
【问题描述】：

我正在查看http://www.w3.org/TR/css3-multicol/，但它只允许您指定column-width 和column-count，可能同时指定两者（单独或通过columns），但没有定义任何类型的指定方式，比如，最小宽度和最大计数。

以category index of OpenBSD ports为例，有71个类别，一般适合9em。

如果我使用ul {-moz-column-width: 9em;}，那么在 89em 及以上，至少有 9 列（89em = 9 ×（9em 的列宽）+8 ×（1em 的列间距）），使得每个列包含的类别很少，而且恕我直言，这使得导航更加困难，因为即使文本从左到右“看起来”，您仍然必须从上到下导航。（或者有没有办法让列的列表从左到右，而不是从上到下？）

如果我改为使用-moz-column-count: 8;，那么该网站在较小的屏幕上的可用性会降低，大约低于 70em 左右。

有解决办法吗？

【问题讨论】：

标签： html css

【解决方案1】：

是的，我们可以使用@media查询来为不同的屏幕指定不同的规则。

http://www.w3.org/TR/css3-mediaqueries/

ul { -moz-columns: 9em; }

@media (min-width: 89em) {
  ul { -moz-columns: 8; }
}

【讨论】：

你有 -moz-columns 而不是 -moz-column-width。实际上，现在我再次查看，在媒体查询中，您应该真正拥有 -moz-column-count。当我们在这里时，-webkit 供应商前缀和非前缀版本。
@andi，我还是不明白错字是什么。 -moz-columns: 9em 是否因某种原因不适合您？它在这里工作得很好。
嗯，你知道吗 - 我的错误。起初它对我不起作用，我不知何故认为速记有问题或其他什么，但现在我再次对其进行测试，这很好。当我最初测试时，我自己一定有一个错字。对不起 - 继续并回滚。