| <!DOCTYPE html> |
| <html lang="en" > |
| <meta charset="utf-8"> |
| <title>text-justify:inter-character and ligatures</title> |
| <link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'> |
| <link rel='help' href='https://drafts.csswg.org/css-text-3/#letter-spacing-property'> |
| <link rel='match' href='reference/letter-spacing-ligatures-001-ref.html'> |
| <meta name=flags content="should"> |
| <meta name="assert" content="When the effective spacing between two characters is not zero (due to either justification […]), user agents should not apply optional ligatures"> |
| <style> |
| @font-face { |
| font-family: 'mplus'; |
| src: url('/fonts/mplus-1p-regular.woff'); |
| } |
| div { |
| font-size: 2em; |
| font-family: mplus; |
| width: 12ch; |
| text-align: justify; |
| text-align-last: justify; |
| text-justify: inter-character; |
| font-kerning: none; |
| } |
| span { |
| display: inline-block; |
| text-justify: auto; |
| } |
| .ref { color: blue; font-variant-ligatures: none; } |
| .noref { color: orange; } |
| </style> |
| <p>Test passes if the black text looks like the blue one, not the orange one. |
| <div>office</div> |
| <div class=ref>office</div> |
| <div class=noref>o<span>ffi</span>ce</div> |
