1117210-1-vertical-baseline-snap-ref.html (1296B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <style> 6 @font-face { 7 font-family: ahem; 8 src: url(../fonts/Ahem.ttf); 9 } 10 11 div { 12 font-family: ahem; 13 font-size: 10px; 14 } 15 16 .lr { 17 writing-mode: vertical-lr; 18 text-orientation: sideways-right; 19 height: 40px; 20 } 21 .rl { 22 writing-mode: vertical-lr; 23 text-orientation: sideways-right; 24 height: 40px; 25 } 26 27 .c { position: relative; top: 10px; left: 10px; } 28 </style> 29 </head> 30 31 <body> 32 <div class="lr c">abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc</div> 33 <div class="lr c">abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc</div> 34 <div class="lr c">abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc</div> 35 <div class="lr c">abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc</div> 36 <div class="lr c">abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc</div> 37 38 <br> 39 40 <div class="rl c">abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc</div> 41 <div class="rl c">abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc</div> 42 <div class="rl c">abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc</div> 43 <div class="rl c">abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc</div> 44 <div class="rl c">abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc<br>abc</div> 45 46 </body> 47 </html>