Question

在Mozilla中，应用像

这样的CSS规则

-moz-column-count: 2;

获取2列，这是页面的完整高度。从他们MDC的建议来看，这被称为“高度平衡”。

Webkit有类似的东西：

-webkit-column-count: 2;

我不完全确定Webkit是否具有“高度平衡”（这可能是我问题的根源，老实说）。在Webkit中，它在页面上以相同的方式显示。但是，当您使用所述柱状内容打印页面时，在Firefox中，打印的页面最终看起来像这样：

A C
B D
---
E G
F H

而Webkit显示如下：

A E
B F
---
C G
D H

有没有办法让Webkit像Mozilla一样打印？

Answer 1

高度平衡意味着如果您没有在元素上指定高度，浏览器将尝试使所有列的高度相等。如果你设置了一个高度，它将不会平衡列的高度，它会将列填充到指定的高度，最后一列将更短。

听起来WebKit行为是他们打印代码中的一个错误。 Mozilla的行为是正确的。您使用的是哪个版本的WebKit，因为我在使用它的测试中根本不打印Chrome 8.0.552.231和Safari 5.0.3中的列。

Answer 2

这是WebKit中的一个错误。当禁用多列打印时，它已被另一个错误所取代：

有一个相关的stackoverflow问题：CSS columns breaking when printing