| <!DOCTYPE html> |
| <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> |
| <style> |
| .container { |
| margin: 30px 0; |
| color: orange; |
| background-color: blue; |
| line-height: 10px; |
| font-size: 30px; |
| font-family: Ahem; |
| } |
| .lh20 { line-height: 20px; } |
| .lh30 { line-height: 30px; } |
| .up5 { position: relative; top: -5px; } |
| .up10 { position: relative; top: -10px; } |
| .down5 { position: relative; top: 5px; } |
| .down10 { position: relative; top: 10px; } |
| </style> |
| <body> |
| <div class="container"> |
| <span>XX</span> |
| <span>XX</span> |
| <span>XX</span> |
| </div> |
| <div class="container lh30"> |
| <span class="up10">XX</span> |
| <span>XX</span> |
| <span class="down10">XX</span> |
| </div> |
| <div class="container"><span>XX</span></div> |
| <div class="container"><span>XX</span></div> |
| <div class="container lh20"><span class="up5">XX</span></div> |
| <div class="container lh20"><span class="down5">XX</span></div> |
| </body> |
