css - column-count !important 被 chrome 忽略

Question

#main .inside .ce_text {
    -moz-column-count: 2;
    -moz-column-gap: 31px;
    -webkit-column-count: 2;
    -webkit-column-gap: 31px;
    column-count: 2;
    column-gap: 31px;
}

#main .inside .ce_tabcontrol_pane .ce_text {
    -moz-column-count: 0;
    -webkit-column-count: 0;
    column-count: 0;
}

在我看来，第二条规则应该比第一条更重要。尽管 chrome 呈现 2 列(!重要也无济于事)。 但是:Safari 做的一切都是正确的。为什么？

Chrome 24

Safari 6.0.2

Answer 1

根据 MDN 0 不是 column-count 的有效输入。

Is a strictly positive describing the ideal number of columns into which the content of the element will be flowed. If the column-width is also set to a non-auto value, it merely indicates the maximum allowed number of columns.

我想，你的意思更像是这样:

#main .inside .ce_tabcontrol_pane .ce_text {
    -moz-column-count: 1;
    -webkit-column-count: 1;
    column-count: 1;
}

Example Fiddle 在 Chrome26 和 Firefox19 中工作。