| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>CSS Reftest Reference</title> |
| <link rel="author" title="Mihai Balan" href="mibalan@adobe.com"> |
| <style> |
| ul:first-of-type, ol:first-of-type { |
| color: blue; |
| } |
| ul:nth-of-type(3) { |
| color: green; |
| } |
| ol, ul { |
| margin: 0; |
| padding: 0; |
| } |
| |
| .region { |
| margin: 2em; |
| background-color: lightgray; |
| width: 200px; |
| } |
| </style> |
| </head> |
| <body> |
| <p>This test passes if there are two gray rectangles: the first with two numbered lists (3 items each), the second with three un-numbered lists (2 items each).<br> |
| First list of each type should be blue, second list of each type should be black and the third un-ordered list should be green. |
| </p> |
| <p>Each numbered list should start at 1.<br> |
| Both the numbers and the list markers should be outside of the gray rectangles.</p> |
| <div class="region" id="r1"> |
| <ol> |
| <li>Ordered list 1, item 1</li> |
| <li>Ordered list 1, item 2</li> |
| <li>Ordered list 1, item 3</li> |
| </ol> |
| <ol> |
| <li>Ordered list 2, item 1</li> |
| <li>Ordered list 2, item 2</li> |
| <li>Ordered list 2, item 3</li> |
| </ol> |
| </div> |
| <div class="region" id="r2"> |
| <ul> |
| <li>Unordered list 1, item 1</li> |
| <li>Unordered list 1, item 2</li> |
| </ul> |
| <ul> |
| <li>Unordered list 2, item 1</li> |
| <li>Unordered list 2, item 2</li> |
| </ul> |
| <ul> |
| <li>Unordered list 3, item 1</li> |
| <li>Unordered list 3, item 2</li> |
| </ul> |
| </div> |
| </body> |
| </html> |
