Rendering of list item marker when in column

Question

Chrome does not number list items when the list is displaied in several columns.

<!DOCTYPE html>
<html>
<head>
<title>Testing li number in column</title>
</head>
<body>
<ol style="column-count:3">
<li>This is item 1.</li>
<li>This is item 2.</li>
<li>This is item 3.</li>
<li>This is item 4.</li>
<li>This is item 5.</li>
</ol>
</body>
</html>

Above code is interpreted without numbering list items except in the first column.

Is there another way to do to get the expected rendering (all items numbered) ? Thank you

Possible duplicate of [Ordered list number with css multiple column](https://stackoverflow.com/questions/34992924/ordered-list-number-with-css-multiple-column) — BobRodes, May 03 '18 at 18:23

score 0 · Accepted Answer · answered May 03 '18 at 18:18

0

You need to add a bit of CSS to make the default style position inside. Try:

li {
  list-style: inside decimal;
}

answered May 03 '18 at 18:18

mkhira2

564
1
7
14

Also work with icons :
This is item 1.

Florimond

May 03 '18 at 18:47

Rendering of list item marker when in column

1 Answers1