css - Opera：最大高度的列数

Question

尝试将列数与最大高度相结合时，我在 Opera 12 中遇到问题。问题是当存在一些固定高度时，Opera 生成的列数超过了列数中指定的列数，而不是添加滚动。

例如，尝试以下 html：

<div>
    <ul>
        <li>1</li> <li>2</li> <li>3</li>
        <li>4</li> <li>5</li> <li>6</li>
        <li>7</li> <li>8</li> <li>9</li>
        <li>11</li> <li>12</li> <li>13</li>
        <li>14</li> <li>15</li> <li>16</li>
        <li>17</li> <li>18</li> <li>19</li>
        <li>21</li> <li>22</li> <li>23</li>
        <li>24</li> <li>25</li> <li>26</li>
        <li>27</li> <li>28</li> <li>29</li>
    </ul>
</div>

使用以下CSS：

div
{
    overflow-x: hidden;
    overflow-y: auto;
    column-count: 2; -moz-column-count: 2; -webkit-column-count: 2; 
    max-height: 100px;
}

您也可以在http://jsfiddle.net/bYhFg/4/看到结果

它在 Firefox/Chrome 中运行良好，但在 Opera 中却不行。在 Opera 中，它生成的列数比指定的多，即多于两个。

我想要实现的是在需要时使用两列和垂直滚动制作固定高度的 div。

Answer 1

试试这个：

div {
    overflow-x: hidden; 
    overflow-y: auto; 
    max-height: 100px; 
}
ul {
    column-count: 2; -moz-column-count: 2; -webkit-column-count: 2; 
}