在 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>