Menu
As google fonts are blocked in China I had to download them and use FontSquirrel for conversion.
The problem: fi/ff/etc are ugly
I did all of the steps here Prevent ligatures in Safari (Mavericks/iOS7) via CSS but no cigar.
How can I disable ligatures at once?
-webkit-font-variant-ligatures: no-common-ligatures;
Doesn't work
259
In FontForge go to Element > Font Info > Lookups > GSUB. You should be able to select a ligature table there. Then you can click Delete to delete all the ligatures or Edit Data to choose which ligatures to delete. After pressing Edit Data you can select specific ligatures.
The font-variant-ligatures CSS property controls which ligatures and contextual forms are used in textual content of the elements it applies to. This leads to more harmonized forms in the resulting text.
A discretionary ligature is more decorative in nature than a standard ligature and should be used at your discretion, as the name indicates. Some discretionary ligatures combine frequently occurring letter pairs (like “Th”) into a single graceful design.
The most common standard ligatures are the f-ligatures: fi, fl, and occasionally ff, ffi, and ffl. These designed letter combinations remedy the unattractive collision that can occur in some typefaces between the hook or crossbar of the f and the dot of the i, or other elements of its neighboring character.
Essentially the same answer that andreas offered, but here's the full CSS for easy reference:
* {
font-variant-ligatures: none;
}
Despite no-common-ligatures you can try values like none, unset or no-contextual . See MDN for all possible values.
For example:
:root {
font-variant-ligatures: none;
}
Also it should be supported in all modern browsers.
12
Seeing no effect in Safari from font-variant-ligatures (see comment on accepted answer above) have used
font-feature-settings: "liga" 0;
which both Safari and Chrome are honouring.
1
Not sure why, but I found a situation when Chrome needs both properties:
body {
font-variant-ligatures: none;
font-feature-settings: "liga" 0;
}
If set any one of them only, ligatures won't be turned off.
1
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
