ビューポート/メディアクエリでも、マイページがAndroid上で正しいサイズで表示されないのはなぜですか？

Question

これは問題のウェブサイトです：

このウェブサイトで気がついたら、白い背景のdivの解像度は、686pxで445pxです。それはまた流動性があるので、あなたがそれを縮小すると、それは異なるサイズに応じて異なるように見えます。 （あなたが400pxより小さい幅を持っている携帯電話の場合、実際には別の画像が表示されます）。

さて、ここでは、このページが以下のようにAndroid搭載端末に正しく表示されていないことがあります。

480PXのx 800ピクセルであることプレビューア内の他のすべての携帯電話と一緒に携帯電話は、そのようなウェブサイトを表示していること。あなたがそれをクリックするとわかるように、ウェブサイトは最大686ピクセルです。なぜこの携帯端末に全ページが表示されないのですか？

"playplanet"ロゴのサイズは実際には180pxで、全幅がほぼ満ちており、その電話の幅は480pxになるようにサポートされています。

ここに何か不足していますか？ 、これらは、デバイスの実際の幅としてページを表示するには、Androidのブラウザを伝えることになっている

<meta name="HandheldFriendly" content="true" /> 
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> 

：

は、あなたがソースコードを見ると、あなたが参照してくださいよ、私は、次のメタタグを追加しましただから、480px X 800px（samsung galaxy s 2は480px X 800px）として表示するように指示する必要がありますが、スクリーンショットを見ると実際にはロゴが180pxなので実際には半分の大きさで表示されます画面全体がほぼ一杯になりました。

完全にそこに収まるはずです。面白いのは実際には私の400px幅のレイアウトよりも小さく、フィーチャの小さい電話機のサイズ（240x320またはその逆）で完璧に動作しますが、この大きなものは私に問題を引き起こしています。

Answer 1

target-densityDpi=device-dpiを試しましたか？

から引用します。this article：Androidチームは、高解像度（HDPI）画面のブラウザのスケーリングをカスタマイズできるようにカスタムメタビューポートプロパティを実装しました。ブラウザが要求したよりも大きなサイズにイメージとフォントを "拡大"するので、CSSの "px"単位はデバイスの実際のピクセルと異なる場合があります。さらに、非整数の倍率（1.5倍のズーム、320pxから480pxへの拡大）を使用しているため、画像が奇妙に見えることがあります。

また、このintroduction to meta viewportでは、「ターゲット密度を設定する」セクションの例は、あなたの場合のように見えます。あなたが見ているスクリーンショットは欠陥がある

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, target-densityDpi=device-dpi"> 

Answer 2

：ここ

が更新されたメタです。標準のLGとSamsungスマートフォンの多くの典型的な240px x 400px解像度でサイトを表示しています。ギャラクシー[あなたが指摘しているように]は明らかにそれより高い解像度を持っています。私の提案は、使用しているサービスにバグを報告し、それを修正するまでは、別の同様の電話を使って試してみてください。適切な解像度を持つ他のAndroid携帯端末であれば、ウェブページは解像度と向きが異なるすべてのAndroid端末でほぼ同じように表示されます。