網頁跑版怎麼查：快取、CSS 還是外掛衝突

為什麼會這樣 #

WordPress 的版面是佈景、頁面編輯器（Elementor 等）、各外掛輸出的 CSS 疊起來的，任何一層變動都可能影響別的區塊。常見情境：手機版沒設響應式尺寸、寬螢幕沒設最大寬度、容器寬度寫死、舊站複製過來的 CSS 片段用了太廣的選擇器、外掛更新後 class 名稱變了。

怎麼處理 #

1. 排除快取：無痕視窗開網頁；清 WordPress 快取外掛、主機快取、CDN 三層。「改了 CSS 沒變」八成在這裡。
2. 分裝置：只有手機壞，到 Elementor 的響應式模式看手機版的字級、間距、隱藏元素；只有寬螢幕壞，多半是容器沒設 max-width，或背景圖用 cover 沒設定位。
3. 開發者工具（F12）：橫向捲軸或右側空白，在 Console 找 scrollWidth 大於 clientWidth 的元素，通常是某容器寫死寬度或 flex 不能縮；元素樣式不一致，看 Computed 是哪個 CSS 檔在覆蓋。
4. 查全站自訂 CSS：外觀 → 自訂 → 額外 CSS、Elementor → 網站設定 → 自訂 CSS、程式碼片段外掛。舊站搬來的片段常用 body span, body div 這種選擇器蓋掉全站字型。
5. 外掛衝突：把最近更新的外掛逐一停用測試，特別是 header/footer 注入類、字型類、優化類（延遲載入 CSS）。
6. iPhone Safari 專屬怪象（電話號碼變藍、變另一種字型）：是 Safari 自動偵測電話號碼，加 format-detection meta 或把號碼包成 tel 連結。

我們實際遇過的情況 #

一個企業站電腦版右側多出空白加橫向捲軸，客戶懷疑是剛加的字級縮放工具。量測後確認不是它，是頁尾容器的「Flex 尺寸」設成不縮、寬度又寫死，兩欄相加超過畫面；改成 Shrink 之後溢出歸零，一行 CSS 都沒動。同一站的頁尾傳真號碼字型跟上一行不一樣，查出來是全站字型被一段舊的片段覆蓋，先修頁尾；同一天還有 iPhone 上號碼顏色跟著變掉，那是 Safari 的電話自動偵測，第一次改的選擇器抓錯，第二次改用 format-detection meta 才修好。

一個內容網站的 Elementor 頁改了樣式前台一直不變，原因是 CDN 把樣式檔快取了一年；改掉全站的 Elementor CSS 輸出方式才解決。一家電商的頁尾整個消失，是跟一支「Header/Footer 插入碼」外掛相衝，停用後恢復。另一家電商停用 WooCommerce 後前台跑版，佈景版面本來就吃它的樣式，不是能隨手關的外掛。

什麼時候該找人 #

跑版伴隨看不懂的文字或連結（可能被植入內容）、停用所有外掛仍然壞、多語站只有某些語言壞（翻譯外掛的模板對應），這些要有人看整體結構，不是改一行 CSS 的事。

網站現在跑版中？網站救援當日受理；想有人每月幫你顧著：網站守護方案。