I have a problem in Opera 12 when trying to combine the number of columns with max-height. The problem is that if there is a fixed height, Opera generates more columns than what is specified in the column-column, instead of adding scroll.
For example, try 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>
with the following css:
div { overflow-x: hidden; overflow-y: auto; column-count: 2; -moz-column-count: 2; -webkit-column-count: 2; max-height: 100px; }
You can also see the result http://jsfiddle.net/bYhFg/4/
It works fine in Firefox / Chrome, but not in Opera. In Opera, it generates more columns than specified, i.e. More than two.
What I am trying to achieve is to make a fixed div height with two columns and scroll vertically when necessary.
source share