grouping-ol-rev-reftest-001.html (2040B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>ol element</title> 6 <link rel="author" title="dzenana" href="mailto:dzenana.trenutak@gmail.com"> 7 <link rel="help" href="https://html.spec.whatwg.org/multipage/#the-ol-element"> 8 <link rel="match" href="grouping-ol-rev-reftest-001-ref.html" /> 9 <meta name="assert" content="OL's reversed attribute creates a descending list." /> 10 <style type="text/css"> 11 span p {display:list-item; margin-left: 0; margin-top: 0; margin-bottom: 0; padding-left: 0; padding-top: 0; padding-bottom: 0;} 12 span li {margin-left: 0; margin-top: 0; margin-bottom: 0; padding-left: 0; padding-top: 0; padding-bottom: 0; font-family: monospace;} 13 span ol {margin-left: 0; margin-top: 0; margin-bottom: 0; padding-left: 5em; padding-top: 0; padding-bottom: 0; font-family: monospace; 14 list-style-position: inside; list-style-type: decimal; } 15 </style> 16 </head> 17 <body> 18 <h1>Description</h1> 19 <p>This test continues to validate the ol element.</p> 20 21 <p>These reftests are necessary because the values of the ol's li children as calculated by the user agent are NOT available programatically. Only explicitly-set values are available programatically. Therefore, we need to check actual rendering against expected rendering.</p> 22 23 <p><strong>This reftest passes if you see an ascending list followed by two descending lists.</strong></p> 24 <p>(Note: each list item has no content; only the sequencing should appear.)</p> 25 26 <span> 27 28 <p>Ordered List</p> 29 <ol> 30 <li></li> 31 <li></li> 32 <li></li> 33 </ol> 34 35 <p>Ordered List - reversed via content attribute</p> 36 <ol reversed="reversed"> 37 <li></li> 38 <li></li> 39 <li></li> 40 </ol> 41 42 <p>Ordered List - reversed via IDL</p> 43 <ol id="reverse_me"> 44 <li></li> 45 <li></li> 46 <li></li> 47 </ol> 48 49 </span> 50 51 <script> 52 document.getElementById("reverse_me").reversed = true; 53 </script> 54 55 </body> 56 </html>