How to adjust the text sizes for iOS devices

Description: The text format in the iOS devices are little different from the normal devices which can be customized with this methods.

SOLUTION:
Adjusting the text size is important so that the text is legible when the user double-taps. If the user double-taps an HTML block element—such as a <div> element—then Safari on iOS scales the viewport to fit the block width in the visible area. The first time a webpage is rendered, Safari on iOS gets the width of the block and determines an appropriate text scale so that the text is legible.

If the automatic text size-adjustment doesn’t work for your webpage, then you can either turn this feature off or specify your own scale as a percentage. For example, text in absolute-positioned elements might overflow the viewport after adjustment. Other pages might need a few minor adjustments to make them look better. In these cases, use the -webkit-text-size-adjust CSS property to change the default settings for any element that renders text.

To turn automatic text adjustment off, set -webkit-text-size-adjust to none as follows:
html {-webkit-text-size-adjust:none}

To change the text adjustment, set -webkit-text-size-adjust to a percentage value as follows, replacing 200% with your percentage:
html {-webkit-text-size-adjust:200%}

Leave a comment

Your email address will not be published. Required fields are marked *