CSS3のMedia Queriesでスマホ用のサイトを作るも解像度の高いAndroidではまったこと : kagzugiの備忘録

Media Queriesを使えばスタイルシートだけでスマホに対応できます。 （賛否両論あるようですが…） あちらこちらのサイトを参考に @media only screen and (max-width: 480px) {...} @media only screen and (max-width: 320px) {...} などと記述して、iPhoneで動作確認し、これはなかなかおもしろいなと思っていました。 ところが最後に確認した新しめのAndoroidで見ると、画面に収まらず右にはみ出ています。 もちろん手でタップとかピンチインすれば合わせられますが、やはり開いた時から 画面に合わせたい所です。 さんざん悩んで調べて分かったことは、 そのAndroidのピクセル数は、横720ピクセル、縦1280ピクセル。 サイトを見る時は横360ピクセルで動作している。 作ったサイトには<meta

[saniman]

最高に役立った！！

[oppara]

CSS3のMedia Queriesでスマホ用のサイトを作るも解像度の高いAndroidではまったこと : kagzugiの備忘録

[lotus_tribal]

端末の表示幅を確認するJavascriptもアリ。