How to fix font display issues on mobile Safari?

Question

I'm having a problem displaying fonts in Safari mobile (Safari displays fine on my Mac). I use the OpenType font along with the @ font-face selector, and some of the characters (mostly just "s" and "c") look much thinner than others (very noticeable - "light" looks in relation to each other, and the rest look “bold.” The strangest thing about this is that it only happens in landscape mode. Has anyone seen this before? The only thing that does this is to set -webkit-transform: translate3d (0, 0,0) , on a body selector that seems completely wrong, but might give some idea of ​​the problem. I came across this on rugom site: http://openradar.appspot.com/11097956 .

Thanks in advance for any help Brandon

Answer 1

It looks the way you need it: Fix font size on Mobile Safari (iPhone), where text is displayed inconsistently and some fonts are larger than others? They used this code to fix it:

/* Mobile browsers only */
@media only screen and (max-device-width: 480px) {      
        td#main_box { -webkit-text-size-adjust:100% }               
}