无内容时底部默认页脚：绝对

Question

我需要像页眉内容和页脚这样的布局。

我的要求是……

页脚Div的默认位置在底部，即使内容Div中没有内容。

当内容Div的内容展开时，整个正文（包括页眉、页脚）需要在内容Div的基础上展开

我不需要位置：固定为页脚Div....

我已经在我的项目中尝试了一些代码......

CSS：

             body
            {
                height:100%;
                margin-left: 0;
                margin-top: 0;
                padding:0;
                width:100%;
                position: relative;
                display:block;
            }
            .container
            {
                display:table;
                width:100%;
                height:100%;
            }
            .header
            {
                top:0px;
                height:75px;
                width:100%;
            }
            .content
            {
                width:100%;
                height:auto;
                position: relative;
            }
            .footer
            {
                top:5px;
                bottom:0px;
                height:45px;
                overflow:hidden;
                width:100%;
            }

代码：

<div>
  <div class="header">
      Header Div
  </div>

  <div class="content">
      Content Div
  </div>

  <div class="footer">
      Footer Div(Need it,default at bottom position)
  </div>
</div>

有什么想法吗？

注意：我也需要在IE中运行这段代码......

Answer 1

将以下样式添加到您的body 标记或content div 元素：

    div { 
       min-height: 500px; 
       height:auto !important; 
       height: 500px; 
   }

这是可行的，因为 IE 对待“高度”的方式应该是对待“最小高度”的方式。