さて、問題のウェブサイトは次のとおりです。
この Web サイトで気が付くと、白い背景の div の解像度は横 445 ピクセル、長さ 686 ピクセルです。また、流動的であるため、収縮すると、異なるサイズに対応するために異なるように見えます. (幅が 400px より小さい携帯電話を使用している場合、実際には異なる画像が表示されます)。
わかりましたが、ここで重要なのは、以下に示すように、このページが Android デバイスで正しく表示されないことです。
その電話は、そのプレビューア内の 480px x 800px の他のすべての電話とともに、そのように Web サイトを表示しています。クリックするとわかるように、ウェブサイトの高さは最大 686 ピクセルですが、このモバイル デバイスでページ全体が表示されないのはなぜでしょうか?
その「playplanet」ロゴのサイズは、実際には幅 180 ピクセルで、幅全体をほぼ埋め尽くしており、その電話の幅は幅 480 ピクセルであると想定されています。
ここで何か不足していますか？
ソース コードを見ると、次のメタ タグが追加されていることがわかります。
<meta name="HandheldFriendly" content="true" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
これらは、デバイスの実際の幅としてページを表示するように Android ブラウザーに指示することになっているため、480px X 800px (samsung galaxy s 2 は 480px X 800px) として表示するように指示する必要がありますが、実際にはスクリーンショットを見てください。ロゴは 180 ピクセルしかなく、画面全体をほぼ埋め尽くしているため、実際にはその半分のサイズで表示されています。
そこに完全に収まるはずです。おもしろいことに、実際には幅 400 ピクセル未満の私のレイアウトは、小さいフィーチャー フォンのサイズ (240 x 320 またはその逆) で完全に機能しますが、この大きいサイズでは問題が発生します。