basic-ref.html (667B)
1 <!DOCTYPE html> 2 <link rel="stylesheet" href="/fonts/ahem.css"> 3 <style> 4 body { 5 font: 50px/1 Ahem; 6 } 7 span { 8 text-wrap: nowrap; 9 } 10 p { 11 word-break: break-all; 12 inline-size: calc(6em + 5px); 13 } 14 .mc { 15 columns: 2 calc(6em + 5px); 16 column-gap: 10px; 17 inline-size: calc(12em + 10px + 10px); 18 block-size: 80px; 19 } 20 .indent { 21 text-indent: -1em; 22 } 23 </style> 24 <p>zzz<ruby><span>mmm</span><rt><span>mmmmmm</span></ruby> <ruby><span>mm</span><rt><span>mmmm</span></ruby>zzz 25 </p> 26 27 <p class="mc">zzz<ruby><span>mmm</span><span>mm</span><rt><span>mmmmmm</span><span>mmmm</span></ruby>zzz 28 </p> 29 30 <p class="indent">zzz<ruby>mmmm<rt>mmmmmmmm</ruby><br><ruby>m<rt>mm</ruby>zzz 31 </p>