Note that there are some explanatory texts on larger screens.

plurals
  1. POSafari removes word-spacing using Typekit with optimizeLegibility
    primarykey
    data
    text
    <p>I have a problem with Safari removing the space between words using Typekit font and text-rendering: optimizeLegibility in the css..</p> <p>It works well in Chrome, so it's not a webkit issue. it works nice in Firefox as well. The reason I want to use optimizeLegibility is because the kerning is horrible in the webkit browsers..</p> <p>Any suggestions of what to do?</p> <p>Edit: <a href="http://jsbin.com/opehiq/5/edit" rel="nofollow noreferrer">I've created a sample here</a> (It works well in Firefox and Chrome, but not in Safari 5.1.7(at least not in Windows))</p> <p>As an alternative if someone could help me getting the start starting point in Firefox as in Chrome I can use lettering.js or something to kern it manually. I couldn't get it to work with text-rendering: optimizeSpeed;</p> <p><strong>Edit : Got this answer from Typekit:</strong></p> <blockquote> <p>I'm sorry you ran into this issue. Unfortunately, we've seen some of these issues with: optimizeLegibility in Safari and Chrome. It seems to be very random and affect certain fonts.</p> <p>I'm sorry to say but there isn't much we can do about this on our side other than file a bug with Safari/Webkit.</p> <p>Could you tell me which font is showing the issue? Let me know and we'll take it from there.</p> </blockquote> <p>Hopefully they'll figure something out :)</p> <p><strong>Edit: I've got more answers from Typekit now.</strong></p> <blockquote> <p>For the large headlines, you can simply change the setting with CSS. That way you have the same starting poing in Firefox:</p> <p>text-rendering: optimizeSpeed;</p> <p>This will change the text-rendering for Firefox and others. Then you can kern with lettering.js.</p> <p>I hope this helps. Let me know if you have any further questions.</p> </blockquote> <p>However I've already tried that, so I let them know, and unfortunately they couldn't help me any more with that issue.</p> <p>I've attached an image of how it looks like in different browsers, all using Windows 7..</p> <p><img src="https://i.stack.imgur.com/oAVcG.png" alt="Text-rendering with typekit on different browsers, using Abril Display"> </p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload