I am creating an ordered list with the default numbering. The list would be more than 300. I have divided into columns using css- column-count which divides the list into columns but the default list numbering is present only for the first column.
Is there a way to get the numbering for the whole list in multiple columns.
Please check FIDDLE
.bucketcol{
float:left;margin-right:10px;
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
height:100px;
}
.bucketcol li{
width:110px;
}
<ol class="bucketcol ui-sortable" id="sortable">
<li class="bucketrow">Object 1</li><li class="bucketrow">Object 2</li><li class="bucketrow">Object 3</li><li class="bucketrow">Object 4</li><li class="bucketrow">Object 5</li><li class="bucketrow">Object 6</li><li class="bucketrow">Object 7</li><li class="bucketrow">Object 8</li><li class="bucketrow">Object 9</li><li class="bucketrow">Object 10</li><li class="bucketrow">Object 11</li><li class="bucketrow">Object 12</li><li class="bucketrow">Object 13</li><li class="bucketrow">Object 14</li><li class="bucketrow">Object 15</li><li class="bucketrow">Object 16</li><li class="bucketrow">Object 17</li><li class="bucketrow">Object 18</li><li class="bucketrow">Object 19</li><li class="bucketrow">Object 20</li></ol>
When default li list style position become outside , so we just make as inside.
Use
list-style: inside decimal;
to li .