窗口底部和适应高度div的Div

Rob*_*Rob 4 html css internet-explorer-6

有没有办法让div总是在窗口的底部,另一个div来改变它的高度以填充它留下的任何空间,并且如果div的内容太长,div将滚动.(我从不希望窗口滚动).

最好通过图片说明:

div布局http://img401.imageshack.us/img401/3209/divs.png

绿色div将始终置于窗口的底部,橙色div将填补空白.当窗口较小时,如右图中,橙色div将更小并将滚动.

绿色div可以切换.有时绿色div会有display: none,然后橙色div会延伸到底部.当绿色div display: block再次出现时,它将再次看起来像.

它必须在IE6中工作.

到目前为止,我可以通过以下方式获得绿色div:

position: absolute;
bottom: 0;
Run Code Online (Sandbox Code Playgroud)

但我不知道如何让橙色div做我想做的事.

ste*_*ita 7

你应该使用fixed而不是absolute

position: fixed;
bottom: 0;
Run Code Online (Sandbox Code Playgroud)


Sin*_*nan 5

你可以看看A List Apart的"探索页脚",

http://www.alistapart.com/articles/footers/

希望它有所帮助,思南

编辑:(纯CSS方式)

你的加价:

<div class="non-footer">Your content goes here.</div>
<div class="footer">Here is for footer content.</div>
Run Code Online (Sandbox Code Playgroud)

你的CSS:

body, html, .non-footer {
    height: 100%;
    min-height: 100%;
    width: 100%;
}
.footer {
    height: 150px;
    margin-top: -150px;
    width: 100%;
}
Run Code Online (Sandbox Code Playgroud)

我可能会遗漏一些细节,但这应该有用,它提供了技巧背后的基本想法.

思南.