November 8, 201213 yr I sort of asked this question in another area. Let me rephrase it here.... Does such a css hack exist that can enable font-smoothing in Firefox / Chrome / Safari / Opera? Either as a tag to place around a single element or as custom css. If css where is it placed? Between the <head> tags? I thank you for your time as I'm working on a redesign of my site (if you remember, it was hideous) but Open-Sans / Tenor-Sans is somewhat grainy in all browswers except IE - as usual with all fonts and I'd like to know the trick to get them to be smooth. Thank you in advance.
November 8, 201213 yr As said in the previous thread -webkit-font-smoothing: antialiased; text-shadow: 1px 1px 1px rgba(0,0,0,0.05); text-rendering: optimizeLegibility; works, but only for Chrome. Font smoothing (AFAIK) was removed from the general CSS spec and only chrome includes the above. I think Chrome is usually the only browser known for badly rendered fonts anyway. How are you implementing the font?
November 8, 201213 yr Author So you said to place <style> html, html a { -webkit-font-smoothing: antialiased; text-shadow: 1px 1px 1px rgba(0,0,0,0.05); text-rendering: optimizeLegibility; < /style> between the <head> tags? In preview - Not that its that bad, just not as crisp as IE. Downloaded the font, the builder recognizes it, I choose it like any other internally used font. I still don't see a difference with or without the code. If the code doesn't work in Firefox, then I suppose it would be futile to even try. Not a big deal. One can hope.... Thank you for your help. : - )
November 10, 201213 yr Its better to use an external css stylesheet <link rel="stylesheet" href="style.css"> Your fonts shouldn't be especially grainy though. Tenor Sans looks perfectly crisp on my Mac using Firefox. Could it be your screen?
November 10, 201213 yr afaik mac's superior font hinting works across all browsers (at the system level?) but on windows chrome really, really sucks, firefox and opera however should be pretty ok so a link to the page would be interesting to see what's happening. possibly a rounding error or inconsistency? like if it's coming out at say 15.66 px or something. have you checked your cleartype settings?
Create an account or sign in to comment