| <!DOCTYPE html> |
| <meta charset="utf-8" /> |
| <title>CSS Reftest Reference</title> |
| <link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com" /> |
| <link rel="mismatch" href="marker-font-variant-numeric-default-ref.html"> |
| <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> |
| <style> |
| @font-face { |
| /* This font looks different with 'font-variant-numeric: tabular-nums' */ |
| font-family: 'Exo 2'; |
| src: local('Exo 2'), |
| url('/css/css-fonts/support/fonts/Exo2-SemiBold.otf') format("opentype"); |
| } |
| ol { |
| float: left; |
| width: 50px; |
| line-height: 25px; |
| list-style-type: none; |
| font-family: "Exo 2"; |
| } |
| span { |
| display: inline-block; |
| font: 25px/1 Ahem; |
| vertical-align: top; |
| width: 25px; |
| height: 25px; |
| } |
| @supports not (selector(::before::marker) and selector(::after::marker)) { |
| /* Allow the test to pass on browsers that support ::marker but not nested |
| ::before::marker nor ::after::marker. On these browsers, the test isn't |
| able to set `font-variant-numeric: normal` on the nested pseudo-elements, |
| so expect `font-variant-numeric: tabular-nums` instead. */ |
| .before, .after { |
| font-variant-numeric: tabular-nums; |
| } |
| } |
| </style> |
| <ol class="decimal"> |
| <li>1. <span>X</span></li> |
| <li>2. <span>X</span></li> |
| <li>3. <span>X</span></li> |
| <li>4. <span>X</span></li> |
| <li>5. <span>X</span></li> |
| <li>6. <span>X</span></li> |
| <li>7. <span>X</span></li> |
| <li>8. <span>X</span></li> |
| <li>9. <span>X</span></li> |
| </ol> |
| <ol class="string"> |
| <li>1. <span>X</span></li> |
| <li>2. <span>X</span></li> |
| <li>3. <span>X</span></li> |
| <li>4. <span>X</span></li> |
| <li>5. <span>X</span></li> |
| <li>6. <span>X</span></li> |
| <li>7. <span>X</span></li> |
| <li>8. <span>X</span></li> |
| <li>9. <span>X</span></li> |
| </ol> |
| <ol class="marker"> |
| <li>1. <span>X</span></li> |
| <li>2. <span>X</span></li> |
| <li>3. <span>X</span></li> |
| <li>4. <span>X</span></li> |
| <li>5. <span>X</span></li> |
| <li>6. <span>X</span></li> |
| <li>7. <span>X</span></li> |
| <li>8. <span>X</span></li> |
| <li>9. <span>X</span></li> |
| </ol> |
| <ol class="before"> |
| <li>1. <span>X</span></li> |
| <li>2. <span>X</span></li> |
| <li>3. <span>X</span></li> |
| <li>4. <span>X</span></li> |
| <li>5. <span>X</span></li> |
| <li>6. <span>X</span></li> |
| <li>7. <span>X</span></li> |
| <li>8. <span>X</span></li> |
| <li>9. <span>X</span></li> |
| </ol> |
| <ol class="after"> |
| <li>1. <span>X</span></li> |
| <li>2. <span>X</span></li> |
| <li>3. <span>X</span></li> |
| <li>4. <span>X</span></li> |
| <li>5. <span>X</span></li> |
| <li>6. <span>X</span></li> |
| <li>7. <span>X</span></li> |
| <li>8. <span>X</span></li> |
| <li>9. <span>X</span></li> |
| </ol> |