| <script src="../../resources/ahem.js"></script> |
| <style> |
| div div { font-family: Ahem; font-size: 32px; -webkit-font-smoothing: none; display: inline-block; margin: 8px 0; } |
| .flipped { writing-mode: vertical-rl; } |
| div.flipped div { display: block; margin:0 8px 0 0; } |
| .over { color: blue; -webkit-text-emphasis: "m"; -webkit-text-emphasis-position: over; } |
| .under { color: green; -webkit-text-emphasis: "m"; -webkit-text-emphasis-position: under; } |
| </style> |
| <div> |
| <div> |
| 1111 |
| <br> |
| <span>2222</span> |
| <br> |
| <span class="over">3333</span> |
| <br> |
| 4444 |
| </div> |
| <div> |
| 1111 |
| <br> |
| <span class="under">2222</span> |
| <br> |
| <span>3333</span> |
| <br> |
| 4444 |
| </div> |
| <div> |
| 1111 |
| <br> |
| <span class="under">2222</span> |
| <br> |
| <span class="over">3333</span> |
| <br> |
| 4444 |
| </div> |
| </div> |
| <div class="flipped"> |
| <div> |
| 1111 |
| <br> |
| <span>2222</span> |
| <br> |
| <span class="under">3333</span> |
| <br> |
| 4444 |
| </div> |
| <div> |
| 1111 |
| <br> |
| <span class="over">2222</span> |
| <br> |
| <span>3333</span> |
| <br> |
| 4444 |
| </div> |
| <div> |
| 1111 |
| <br> |
| <span class="over">2222</span> |
| <br> |
| <span class="under">3333</span> |
| <br> |
| 4444 |
| </div> |
| </div> |