Question

在尝试将列数与max-height组合时，我在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

尝试this：

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

Opera：具有最大高度的列数

1 个答案: