MobileMedia查詢寬度問題

Question

我有一個網站，我正在作出響應，以適應任何屏幕大小。問題是在較小的（320像素）屏幕上，我的頁面最右側出現了一些「空白區域」，我可以在iPhone 5和BBz10上再現這一點。任何幫助深表感謝！在我的HTML我宣佈

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"> 

在我的CSS文件....

html{ 
    font-size:62.5%; 
    margin:0; 
} 

body{ 
    margin:0; 
    width:100%; 
    font-family:'Arial', sans-serif; 
    font-size:1.4rem; 
    font-size:14px; 
    background-color:#F0F1EC; 
    color:#545452; 
} 
#header{ 
    background-color:red; 
    height:25px; 
} 


@media screen and (min-width : 320px) and (max-width : 555px) { 

    //there is no code related to widths of any element in this media query 
} 

Answer 1

如果它這會導致在右側滑動，你可以嘗試添加以下媒體查詢多餘的空白..

@media screen and (max-width:320px) { 
body, html{ 
max-width:320px; 
overflow-x:hidden; 
} 
}