I use this in the html:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;">
and this in the CSS:
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }\
also tried this:
html { -webkit-text-size-adjust: none; }
and yet for some reason this happens:
Update: I tried removing all styling to see if any of my CSS is causing this, and the result was weird: when I'm not using any font rules, the font simply gets larger (it is not zoomed in since the zooming is locked by the HTML viewport attribute) also, only the small font gets larger, the headers remain the same. weird @#$%
Update 2: I played with the html/css and came to this conclusion - the only time when the text enlargement DOESN'T happen is when the text is contained inside the only element in the page - for example if all my body contains is p/span/div with text, it will not get enlarged. If I add another element with text in it, all text on page becomes enlarged in landscape mode.
I tried doing some research and looked through many mobile sites, and the result is the same - they all have this effect.