letter-spacing-ligatures-002-ref.html (663B)
1 <!DOCTYPE html> 2 <html lang="en" > 3 <meta charset="utf-8"> 4 <title>letter spacing and ligatures</title> 5 <link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'> 6 <style> 7 @font-face { 8 font-family: 'mplus'; 9 src: url('/fonts/mplus-1p-regular.woff'); 10 } 11 div { 12 font-size: 2em; 13 font-family: mplus; 14 width: 12ch; 15 font-variant-ligatures: none; 16 letter-spacing: 0; 17 font-kerning: none; 18 } 19 i { 20 padding-left: 20px; 21 } 22 .ref { 23 color: blue; 24 } 25 </style> 26 <p>Test passes if the black text looks like the blue one. 27 <div>o<i></i>f<i></i>f<i></i>i<i></i>c<i></i>e</div> 28 <div class=ref>o<i></i>f<i></i>f<i></i>i<i></i>c<i></i>e</div>