Webデザイン
CSS
フロントエンド
ランドスケープ表示で文字が大きくなる
iOS や Android の Web ブラウザには縦向きと横向き表示があります。
それぞれ Portrait Mode と Landscape Mode と呼びます。
ジャイロセンサの働きで縦向きから横向きに表示が切り替わるとき、文字のサイズは自動調整されますが、意図せずポートレート表示時と同じ比率で文字が拡大されてしまうことがあります。
ランドスケープ表示時に文字の表示倍率が変わらないよう制御するには「 -webkit-text-size-adjust プロパティ」を使います。
body {
-webkit-text-size-adjust: 100%;
}
これが有効になると、ランドスケープ表示時の文字サイズがポートレート表示時と同一になります。