屏幕底部和页脚 div 之间没有空间答案

【问题标题】：No space between bottom of screen and footer div屏幕底部和页脚 div 之间没有空间
【发布时间】：2010-01-30 05:34:27
【问题描述】：

我在屏幕底部和最后一个 div 之间创建空间时遇到问题。

在 Chrome 中，没有问题，但在 IE 中，边框位于屏幕底部。

<div id="container">
 <div id="header">...</div>
 <div id="main">...</div>
 <div id="footer">...</div>
</div>

最后一个div只有<br />的

这是css...

html,
body {
   margin:0;
   padding:0;
   height:100%;
}
#container {
   top:30px;
   left:15px;
   width:60%;   
   border:black solid 1px;
   min-height:100%;
   position:relative;
}
#header {    
   padding:0px;
}
#body {
   background-color:FAF0E6;
   padding:10px;
   padding-bottom:25px;   /* Height of the footer */
}
#footer {
   position:absolute;
   bottom:10px;
   width:100%;
   height:25px;   /* Height of the footer */
}

就像我说的，在 Chrome 中效果很好，但在 IE 中效果不佳。

我想要的是屏幕顶部和底部的空间。

编辑- 作为补充说明，我什至看不到 IE 中的底部边框。

感谢您的帮助，

-克里斯

【问题讨论】：

标签： html css internet-explorer

【解决方案1】：

您可以在#container 中将 min-height:100% 替换为 height:100%。在 IE8 中工作。

编辑：这是你要找的吗？

html { 边距：0；填充：0； } 身体 { 背景颜色：FAF0E6；边距顶部：35px；边距底部：10px； } ＃容器 { 左：15px；宽度：60%；高度：100%；位置：相对； } #标题{ 填充：0px； } #页脚{ 位置：绝对；底部：10px；宽度：100%；高度：25px； }

【讨论】：

这似乎仍然无法正常工作......似乎也让 Chrome 陷入了循环。
这与我试图实现的目标非常接近。实际上它给了我屏幕底部和 div 之间的空间。谢谢！

【解决方案2】：

尝试将border-bottom: solid #FFFFFF 10px; 添加到正文样式中。在 IE8 中为我工作。

【讨论】：

我仍然没有看到任何创建的空间。我在代码中添加了margin-bottom:25px;。