{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 手持菜刀，她持情操 的问题《CSS: Disabling automatic rescaling of font-size on》','https://www.manongdao.com/q-896295.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
As explained here, the Apple iPhone (i.e. Safari) rescales the font-size when the viewport changes (i.e. from portrait to landscape or vice versa).
The accepted answer to that question says that, in order to disable this behaviour, one should add:
-webkit-text-size-adjust: none;
(Note: in other posts I've also seen '100%' instead of 'none', which may be preferable, but the distinction seems irrelevant here.)
Accordingly, my main question is why, when I view the following HTML test-file on my iPhone, the fixed-sized font is STILL rendered bigger in landscape as compared to portrait view:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>Untitled Document</title> <style> p { font-size:24px; -webkit-text-size-adjust:none; } </style> </head> <body> <p>This is an example text</p> </body> </html>
However, I'd also like to have it confirmed that the Apple iPhone - and possibly other Apple devices - are the ONLY devices displaying this (to me, annoying) behaviour... is that true?
Incidentally, I find it annoying because I can't test properly on my iPhone if my website (i.e. font-size) is rendered differently on other mobile devices (and I don't fully trust online emulators).
Thanks.
It does appear that this solution is right.. but according to Mozilla it is still experimentall.
These are the full set of values you can try but developers are still working to get the mobile algorithm correct to not have the issue are experiencing. Maybe one of the other values would work better for you.
You can find more information here.
https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust