0
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

iPhoneのSafariで横向きにしたときに文字が一部拡大してしまう

Last updated at Posted at 2019-11-14

【CSS3】iOSのサファリで縦画面から横画面にすると文字が大きくなるのを防ぐ設定

iPhone Safari 横
24007581-BA54-4D6D-BB66-639D5167D9E0.jpeg
iPhone Safari 縦
853E5CD4-3F1A-441B-B4A4-3BE7FFE7EEC6.jpeg

横にすると、※1が拡大されてしまう。
おそらくiPhoneのSafariのみ。
なので、
text-size-adjust
これでテキストの自動拡大アルゴリズムを制御する。

    body {
    	//iPhoneのSafariでで横向きにした際に一部文字が拡大されてしまうための対応
      -webkit-text-size-adjust: 100%;
    }

これで出来る。
Can I use... Support tables for HTML5, CSS3, etc
iOSのSafariではprefixが必要なので、-webkit-をつける。

ただnoneは指定してはいけない。
[備忘録]「-webkit-text-size-adjust」は指定しておこう、今のところは! | ultimate-ez.com

PCでのユーザビリティに影響するらしい。

0
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?