| OLD | NEW |
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <title>CSS Rhythmic Sizing: line-height-step vertical-align test</title> |
| 3 <link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com"> |
| 4 <link rel="help" href="https://drafts.csswg.org/css-rhythm-1/#line-height-step"> |
| 5 <link rel="match" href="reference/line-height-step-valign-001.html"> |
| 6 <meta name="assert" content="This test asserts the vertical-align property with
the line-height-step property."> |
| 7 <meta name="flags" content="ahem"> |
| 8 <style> |
| 9 div { |
| 10 font-family: Ahem; |
| 11 font-size: 40px; |
| 12 } |
| 13 .test { |
| 14 line-height-step: 80px; |
| 15 } |
| 16 .ref { |
| 17 line-height: 1; |
| 18 } |
| 19 .adjuster { |
| 20 line-height: 80px; |
| 21 color: transparent; |
| 22 } |
| 23 .top { |
| 24 vertical-align: top; |
| 25 } |
| 26 .text-top { |
| 27 vertical-align: text-top; |
| 28 } |
| 29 .text-bottom { |
| 30 vertical-align: text-bottom; |
| 31 } |
| 32 .bottom { |
| 33 vertical-align: bottom; |
| 34 } |
| 35 </style> |
| 36 <p class="instructions">Test passes if two lines are the same. |
| 37 <div class="ref"> |
| 38 <div>XX<span class="top">X</span><span class="text-top">X</span><span class="t
ext-bottom">X</span><span class="bottom">X</span><span class="adjuster">X</span>
</div> |
| 39 </div> |
| 40 <div class="test"> |
| 41 <div>XX<span class="top">X</span><span class="text-top">X</span><span class="t
ext-bottom">X</span><span class="bottom">X</span></div> |
| 42 </div> |
| OLD | NEW |