Firefox 下 iframe 嵌套 JSP 頁面空白無法顯示的解決方案

現象描述

在一個 <div> 中嵌套 <iframe> 載入 JSP 頁面，Chrome、IE、360 瀏覽器均正常顯示，唯獨 Firefox 主窗口一片空白。

根因分析

檢查樣式發現，包裹 iframe 的父級 <div> 設定了 height: 0。Firefox 對高度為 0 的容器不會撐開 iframe，導致內容不可見；而其他瀏覽器可能自動計算高度或忽略該限制。

解決方法

1. 移除父級 div 的 height: 0 樣式；
2. 或顯式給父級 div 設置具體高度（如 height: 100% 或固定像素值）；
3. 同時確保 iframe 本身設定 width: 100%; height: 100%; border: none;。

修正後的關鍵 CSS

.iframe-container {
    /* height: 0;  刪除這行 */
    height: 100%;       /* 或具體像素 */
    width: 100%;
}
.iframe-container iframe {
    width: 100%;
    height: 100%;
    border: none;
}

驗證

修改後在 Firefox 重新載入，JSP 內容正常顯示。問題核心在於 容器高度為 0 導致 iframe 無顯示區域，修正容器高度即可跨瀏覽器兼容。