Question

我想：

<div style="height:100%">
  <div style="height:70px;">header</div>
  <div style="overflow-y:scroll;">main</div>
  <div style="height:60px;">footer, alw. at bottom parent-div</div>
</div>

真实（px）容器高度可能会改变客户端窗口大小的dep，在css-theme中设置的页脚高度和页眉。

所有定位都应该是相对的。 JS需要解决这个问题吗？

（尝试高度：主要上的自动，似乎没有效果。）

Answer 1

您可以使用absolute定位来轻松实现此目标，为什么要定位relative？

#header, #main, #footer {
    left: 0;
    right: 0;
    position: absolute;
}     

#header {
    top: 0;
    height: 70px;
    background-color: yellow;
}

#main {
    top: 70px;
    bottom: 60px;
    background-color: lime;
    overflow: auto;  
}

#footer {
    bottom: 0;
    height: 60px;
    background-color: red;
}

JSFiddle：http://jsfiddle.net/Tg8g5/

汽车高度＆amp;滚动中间div - 可能吗？

1 个答案: