iPhone 6中的水平滾動條

Question

我在我的網站中使用了wordpress twentyten主題的響應版本，並稍微調整了一些css以更好地顯示內容。

我的網站在iPhone 4 + 5上看起來不錯，但是當我在我的老闆iPhone6上查看它時，網站會水平滾動。我很確定我有正確的css媒體查詢大小'667'，所以我不確定爲什麼6的內容似乎正在擴大在頁面的版權。

我之前沒有做過很多的移動實現，所以也許有人可以發現我錯過/不明白的東西。

我的網站是在這裏：http://www.inspiredental.ca/new/

而且我做了CSS的響應部分的引擎收錄：http://pastebin.com/4E6wSA1p

---

Answer 1

我不能複製錯誤一個瀏覽器，但有一個標誌我看到在CSS中：

#container { 
    margin: 0 -320px 0 0; 
} 

嘗試把你的媒體查詢這裏面並測試它在你的iPhone再次，看看是否這就是問題所在：

#container { 
    display: none; 
} 

如果你不想使用框架，你可能要重新寫＃像這樣的容器：

#container { 
    float: left; 
    margin: 0; 
    width: calc(100% - 300px); 
} 
#content { 
    margin-right: 0; 
} 

在您的主容器上有一個很高的負餘量就是要求麻煩。對容器和側邊欄執行百分比並使用媒體查詢操縱它們更容易。上面的示例讓您在重置邊距時爲側邊欄指定了固定寬度。