css - 多列 CSS 列表绝对定位

Question

我使用 column-count 在绝对定位的 div 中得到了一个多列列表:

div {
    position: absolute;
}

ul {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}

<div>
    <ul>
        <li>ListItem1</li>
        <li>ListItem2</li>
        <li>ListItem3</li>
        <li>ListItem4</li>
        <li>ListItem5</li>
        <li>ListItem6</li>
        <li>ListItem7</li>
        <li>ListItem8</li>
        <li>ListItem9</li>
    </ul>
</div>

这在所有主流浏览器中都可以正常工作，但是在 Safari 7 中，div 不会扩展到双列列表的宽度，而是保持与单列列表相同的宽度:

我是否遗漏了什么，我是在滥用列计数属性还是这是一个错误？

Answer 1

您使用它很好，它是 Safari 5.1+ 中记录的错误，并且与绝对定位有关。如果您将 div 的位置更改为相对位置，而不是绝对位置，它会起作用。