すべてのモバイルデバイスの画面幅を検出

Question

Google ChromeのインスペクタでGalaxy S5（360px）を選択してシミュレーションすると、適切な画面幅を検出できません。 360px用のCSSは省略し、代わりに768pxのCSSを使用します。これの周りに良い方法がありますか？

@media only screen and (max-device-width: 360px) 
{ 

    .header_2{width:100%;height:auto;padding:20px;} 
    .left_obj{width:290px; position:relative;float:left;margin-bottom:20px;} 
    .right_obj{width:290px; position:relative;float:left;} 
    .mini_header{margin-bottom:20px;} 

} 


@media only screen and (max-device-width: 768px) 
{ 

    .header_2{width:100%;height:auto;padding:20px;} 
    .left_obj{width:370px; position:relative;float:left;margin-bottom:20px;} 
    .right_obj{width:370px; position:relative;float:left;} 
    .mini_header{margin-bottom:20px;} 

} 

Answer 1

のために、このリンクを参照することができます。最初に768のメディアクエリを書き込んでから360.

Answer 2

ヘッダーにメタを追加できます。

<meta name="viewport" content="width=device-width"> 

あなたもちょうどあなたのメディアクエリの順序またはその逆を変更する完全な詳細 http://learn.shayhowe.com/advanced-html-css/responsive-web-design/