LoginSignup
0
0

More than 3 years have passed since last update.

スマホを横向きにした時の右余白を消したい!

Last updated at Posted at 2021-03-16

症状

iPhoneなどのスマホを横向きにした時に、
右側に余白が出来ることがあります。

「そんな余白を消したい!!」

という時の対処法です。

対処法

1.画面右側からはみ出ている要素がないか確認する。はみ出ていれば修正する。
2.viewportの指定を確認する
3.htmlタグ、bodyタグにwidth: 100%;が指定されているかを調べる。されていなかったら指定する。
4.bodyタグにmin-width: 100%;を指定する。

手順1

1の方法で問題なければバンザイです。
2へ進む必要はありません。

手順2

2については、最低限下記を指定します。

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">

initial-scale=1minimum-scale=1の記述が抜けていることがあるので、
抜けていたら追加してください。

手順3、4

2を完了したあと、手順3、4を確認します。
3で問題なければ4の対応をする必要はありません。

とりあえず、私はこれでなんとかなりました。
よかった。

参考サイト

終わりに

取り急ぎ、備忘録として。
以上です。

0
0
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
0