numbering-5.html (802B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>Testcase for reordered 'li' flex items</title> 5 <style> 6 .container { 7 list-style: decimal inside; 8 display: flex; 9 flex-direction: column; 10 } 11 </style> 12 </head> 13 <body> 14 <ol class="container"> 15 <!-- Should be reordered to nearly the end: --> 16 <li style="order: 3">List item 1</li> 17 <li>List item 2</li> 18 <li>List item 3</li> 19 <!-- Should be reordered to the start: --> 20 <li style="order: -2">List item 4</li> 21 <li>List item 5</li> 22 <!-- order has no effect here, since it's not set on the flex item: --> 23 <div><li style="order: -3">List item 6</li></div> 24 <!-- Should be reordered to the end: --> 25 <div style="order: 5"><li>List item 7</li></div> 26 <div><li>List item 8</li></div> 27 </ol> 28 </body> 29 </html>