在 Internet Explorer 11 中，頁腳顯示在屏幕中間而不是底部

Question

在 IE11 中，頁腳顯示在屏幕中間而不是底部。 在我們將瀏覽器升級到 IE11 之前，我正在使用下面的 CSS，它是工作文件。

#footer {
    clear: both; 
    height:45px; 
    position: absolute; 
    bottom: 0; 
    left: 0; 
    border: none; 
    width: 100%;
}

注意：- 我的頁面有一個選項卡視圖，我們在 MVC 中使用布局模板。 請提出一些解決方案。

Answer 1

您的 CSS 沒有任何問題。 根據經驗，我能預見的唯一問題是您的頁腳有一個父元素，其屬性position: relative;

這會導致“絕對”定位相對於父級而不是窗口本身。

另外，你可能沒有clear:both; . 如果頁腳中有浮動元素，只需添加overflow: auto; 這將清除您的浮動！

Answer 2

它現在可能不太相關，因為 IE 似乎越來越不受歡迎，但就垂直定位而言，IE 唯一正確識別的是 div。 因此，在我的情況下似乎有幫助的是將所有元素（包括頁腳）強行放入其自己的 div 中：

<div style={{position: "sticky", top: "0px", zIndex: "10"}} >
    <Nav />
</div>
<div>
    <C {...props} {...cProps} />
</div>
<div style={{marginTop: "20px"}}>
    <Footer />
</div>