Font size rendering inconsistencies on an iPhone

by

To improve on Lukasz’s idea slightly, try using the following rule in your CSS:

body {
    -webkit-text-size-adjust: 100%;
}

Using the value ‘100%’ instead of ‘none’, allows all other Webkit-based browsers to still resize text when using the zoom function while still preserving your original font size.

This issue is arising only in modern browsers like safari, opera with iPhone device.
Solution is

Append this style with the -webkit-text-size-adjust: 100%; or -webkit-text-size-adjust: none; with required class it works fine.
Example:
I want the condition to be applied only when request comes from mobile. So I have appended the complete navigation path that full fills my requirement.

.mobile-phone .authenticated-page.authenticated.mobile-community.mobile-document .notification .notification-dialog.content-frame 
{
    -webkit-text-size-adjust: none;
}

or 

.mobile-phone .authenticated-page.authenticated.mobile-community.mobile-document .notification .notification-dialog.content-frame {
-webkit-text-size-adjust: 100%;

}
both will work fine. No need to apply the styles for complete body

More Related Contents:

  1. :active pseudo-class doesn’t work in mobile safari
  2. CSS submit button weird rendering on iPad/iPhone
  3. Fix font size issue on Mobile Safari (iPhone) where text is rendered inconsistently and some fonts are larger than others?
  4. How can I check if an app is installed from a web-page on an iPhone
  5. HTML5 Video tag not working in Safari , iPhone and iPad
  6. position: fixed doesn’t work on iPad and iPhone
  7. How to disable phone number linking in Mobile Safari?
  8. Browsers’ default CSS stylesheets
  9. iPhone 5 CSS media query
  10. iPhone WebKit CSS animations cause flicker
  11. Preserve HTML font-size when iPhone orientation changes from portrait to landscape
  12. list every font a user’s browser can display
  13. Fixed positioning in Mobile Safari
  14. Does overflow:hidden applied to work on iPhone Safari?
  15. How can I determine what font a browser is actually using to render some text?
  16. Do iPhone / Android browsers support CSS @media handheld?
  17. Turn off iPhone/Safari input element rounding
  18. Detect iPhone/iPad purely by css
  19. A html5 web app for mobile safari to upload images from the Photos.app?
  20. How can I autoplay media in iOS >= 4.2.1 Mobile Safari?
  21. Styling input buttons for iPad and iPhone
  22. iPhone “Bookmark to Homescreen” removes cookies and session?
  23. Background image not showing on iPad and iPhone
  24. How to add custom fonts to an iPhone app?
  25. iOS: Programmatically add custom font during runtime
  26. How can we use custom font in an iOS app? [duplicate]
  27. When setting a font-size in CSS, what is the real height of the letters?
  28. Custom Arabic font in iOS
  29. italic, bold and underlined font on iPhone
  30. What fonts do iPhone applications support? [closed]

Leave a Comment