css - モバイル デバイスの高さの問題

Question

モバイル用のウェブサイトをコーディングしています。こういうことは初めてなので何が悪いのかわかりません。

テキストがページの高さに収まる場合はすべて問題ありませんが、モバイル画面の高さよりも高い場合、ページがめちゃくちゃになります (ページの右側にパディングが追加され、そこに空白ができます)。

私は試した

body { height: auto }

と

body { height:100% }

私は何か間違ったことをしていると確信しています。助けてください。ありがとう

Answer 1

あなたの問題は、サイズがオフになっているために画面が自動調整されているためだと思います。これを避けるには、ページの上部にこの便利なコードを挿入する必要があります

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

一部のモバイル ブラウザの自動調整を取り除きます。Mozilla にはここに例があります。

レスポンシブ CSS メディア クエリも参照してください。(私の意見では) モバイルを処理するための最良の方法です。Brad Frostは、レスポンシブ デザインについて学ぶのに最適な人物です。

それが役立つことを願っています。