页脚仅在 IE 中出现在页面中间答案

【问题标题】：Footer appears in the middle of the page in IE only页脚仅在 IE 中出现在页面中间
【发布时间】：2020-02-18 06:22:36
【问题描述】：

我使用这些样式信息使页脚贴在网页底部，它在 FF、Chrome 和 Opera 中非常有效。仅在 IE 中，页脚出现在页面中间而不是底部。

body { margin: 0; padding: 0; height: 100%; font-family: Georgia; }

#parent 
{
    min-height: 100%;
    position: relative;
}

#header { position: relative; left:0px; top:0px; width: 100%; height:45px; background-color: black; }

#content { padding-bottom: 150px; position: relative; }

#footer { position: absolute; left: 0px; width:100%; bottom: 0; height:80px; background-color: black; }

HTML结构如下：

HTML 正文标记
- 父级
  - 标题
  - 内容
  - 页脚

更新

我想如果我为 IE 添加一个条件 this 选择器，它可以在两个浏览器中工作。

#parent { height: 100%; /* min-height: 100%; */ }

现在，有人可以告诉我在作为外部 HTML 文件包含的 .css 文件中添加条件 CSS 注释是否合法？我猜不是。如何在不使用额外的仅 IE 的 CSS 文件的情况下使用此条件注释？

【问题讨论】：

标签： css internet-explorer internet-explorer-8

【解决方案1】：

这应该会有所帮助：

html {
height: 100%;
}

查看源代码并在任何浏览器上试用：Footer at the bottom of the page。它适用于 IE7、IE8 和 IE9，只有 IE6 及以下不会因为 min-height 属性。我认为放置正确的 DOCTYPE 将解决您的问题。希望有帮助。

【讨论】：

查看源代码并在任何浏览器上试用：Footer at the bottom of the page。它适用于 IE7、IE8 和 IE9，只有 IE6 及以下不会因为 min-height 属性。我认为放置正确的 DOCTYPE 将解决您的问题。希望对您有所帮助。
哇！你就是那个男人！它就像一个魅力。把 DOCTYPE 工作。耶！你真是太棒了。而且你很善良。你只为我放了整个网页。哇！非常感谢。
只是出于好奇，您在该域上使用了什么服务器端技术？我可以看到它有一个基于 url 路由 mvc 的框架，如 rails 或 asp.net mvc。
我需要至少 15 名声望才能投票支持您的答案。一旦我获得最低声誉，我就会这样做。再次感谢。
这只是一个简单的 HTML 页面，没有框架。我刚刚创建了一个名为“footer”的文件夹并上传了这个文件。制作大约需要2分钟，所以没什么大不了的。我很高兴能帮上忙。

【解决方案2】：

几周前我遇到了同样的问题，并找到了一个很好的教程。 Click here! 这个解决方案背后的总体思路是创建一个包装器来吸收大部分页面，只留下足够的空间让您的页脚位于页面底部。这个技巧在 IE 中绝对有效。

【讨论】：

我的结构大致相同，如果你密切注意的话。你提到的包装是我的#content div。
感谢您的帮助。改变网站所有页面的结构是一项巨大的投资。但是，如果没有其他方法，我肯定会完全尝试这个。目前，我有两种选择：一种是在 CSS 中使用条件注释来简单地告诉 IE 使用不同的样式表。另一个是看看每个页面上正确的 DOCTYPE 声明是否会消除我的问题。