【ios問題】実機確認・iPhoneを横にして見るとテキストが大きくなるのを直す方法

コーディング最後の大事な作業、品質チェック

チェックを行うのは主に下記のデバイスです(タブレットは省略しています)

パソコン💻なら、MacWindowsの、ChromeSafariFirefoxEdge
スマホ📱なら、iPhoneAndroidの、ChromeSafari(iPhoneのみ)

各デバイスで表示崩れや動きにおかしな点がないかをチェックしていきます

そんな中、かなりの確率で異常現象に出くわすのが iPhone(ios)です

今回は、iPhoneで画面を縦で見たときは大丈夫なのに、
『横にした見たときだけ』テキストが大きくなってしまう問題の対策をご紹介します

スポンサーリンク
目次

ios問題・text-size-adjustを使う

これで一発解決

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

一部のテキストだけがそうなってしまう場合は、その要素に対してだけ指定しても良いです

複数現象が出るようなら、htmlbody などに指定しても良いのかなと思います

実機確認・iPhoneを横にして見るとテキストが大きくなるのを直す方法・まとめ

この現象は必ず起きるものではないってのがまた摩訶不思議なところで・・・

他にもios問題はほぼ毎回と言っていいほど出くわすので、修正に頭を悩ませることが多いです。。

何度か対応しているとすぐに直せるようになるので、このブログでもちょくちょく対策を載せていこうとおもいます

ではまた!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次