column-count !important 被 chrome 忽略答案

【问题标题】：column-count !important is ignored by chromecolumn-count !important 被 chrome 忽略
【发布时间】：2013-01-31 08:32:43
【问题描述】：

#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 列（！important 也无济于事）。但是：Safari 所做的一切都是正确的。为什么？

Chrome 24

Safari 6.0.2

【问题讨论】：

标签： css google-chrome safari multiple-columns

【解决方案1】：

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

是一个严格的正数，描述了元素内容将流入的理想列数。如果 column-width 也设置为非自动值，则仅表示允许的最大列数。

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

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

Example Fiddle 在 Chrome26 和 Firefox19 中工作。

【讨论】：