Prevent iOS from changing text size after orientation changes

If you're developing a responsive site you might have encountered this problem.

Or perhaps you haven't since I'm sure all of this famous templates such as Bootstrap, HTML5 Boilerplate or Normalize.css already have it fixed.


When viewing your site in an iOS device portrait mode the text looks good but when you change the orientation to landscape it looks bigger.

Basically browsers on smartphones don't display pages using the same algorithms as the browsers rendering pages on desktop.


Just add the text-size-adjust: 100% property to your CSS to force the text size.

html { -moz-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
Code language: CSS (css)

Leave a Reply

Add <code> Some Code </code> by using this tags.