0%

如何快速修復手機版網頁右方出現空白的狀況

RWD網站在手機瀏覽器有時會能夠非預期左右滑動,往右滑滑出一大塊空白

解決辦法有兩個,
一個是用瀏覽器的檢查工具慢慢找出是哪個元素跑出去
另外一個是眼不見為淨的方式,在求快解決問題的時候非常好用:

1
2
3
4
body {
max-width: 100%;
overflow-x: hidden;
}

這個選擇器的設定值下在body標籤上可確保網頁內容的寬度限制在滿版100%以內,overflow-x設定為auto則是將網頁左右超出的部分隱藏,即可避免出現四向滑動的問題。但有時間還是要找出是哪個元素出了問題,否則日後這個問題會回頭找你的麻煩。