CSS - 無法確定多餘的水平滾動來自哪裏？

Question

我一直在嘗試修改使用媒體查詢的響應式網站。

當網站縮放到移動大小時，無論您製作的屏幕大小如何，都需要水平滾動。

我試圖改變一切，我認爲可能會造成這一點，但不能達到它的底部。

這裏是鏈接到網站和媒體查詢CSS文件

http://stopcry.in http://stopcry.in/styles/media-queries.css

Answer 1

你在一個寬度添加填充：100％#sidebar和#container的所以總寬度永遠超過100％;嘗試使用百分比值也可用於填充，因此總寬度將爲100％;像這樣：

#sidebar{width:90%; padding:25px 5% 10px} 
#container{width:90%; padding:5%;} 

Answer 2

填充添加在％寬度/高度之上。所以當你有100％的填充寬度時，它會超過100％。

一個快速解決方案將box-sizing: border-box改變箱模型，但你可能想要去另一個路線。

http://caniuse.com/css3-boxsizing

編輯：看來我遲到後...

Answer 3

添加到您的CSS

*{ 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 

} 

或

.Your_Container{ 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 
}