Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Prevent ligatures in Safari (Mavericks/iOS7) via CSS

Is there any possibility to prevent Safari/Mobile Safari on Mavericks/iOS7 from rendering ligatures in a Webfont? We're facing issues with not available ligatures in the font beeing displayed as white space.

We already tried using this in the CSS:

-webkit-font-feature-settings:"liga" 0; 
font-feature-settings:"liga" 0; 
text-rendering: optimizeSpeed;

But it's not working, the ligatures are still blank spaces.

like image 909
bardiir Avatar asked Oct 25 '13 13:10

bardiir


1 Answers

We solved this by adding

 -webkit-font-variant-ligatures: no-common-ligatures;

to the css styles. It prevents the ligatures from appearing and thus the broken symbols in the font.

like image 84
bardiir Avatar answered Oct 14 '22 09:10

bardiir