ウェブサイトを持っていますここ。
bodyデスクトップ ブラウザーで表示すると、があるため、黒いメニュー バーはウィンドウの端までしか適切に拡張されませんoverflow-x:hidden。
Android や iOS を問わず、どのモバイル ブラウザーでも、黒いメニュー バーが全幅で表示され、ページの右側に空白が生じます。私の知る限り、この空白は またはhtmlタグの一部でさえありませんbody。
ビューポートを特定の幅に設定しても<head>、
<meta name="viewport" content="width=1100, initial-scale=1">
サイトは 1100 ピクセルまで拡張されますが、1100 を超える部分にはまだ空白が残っています。
何が足りないのでしょうか? ビューポートを 1100 に保ち、オーバーフローを切り取るにはどうすればよいですか?
ベストアンサー1
内にサイトラッパーdivを作成し<body>、overflow-x:hiddenに適用します。ラッパー代わりに、<body>または<html>問題を修正しました。
タグを解析するブラウザは、 タグとタグの属性を<meta name="viewport">単に無視するようです。overflowhtmlbody
position: relative注:ラッパー div に追加する必要がある場合もあります。