好的,首先我要回到IE7,所以盒装大小已经出来了。
我有一个固定大小的页眉和页脚(每个80px)分别位于窗口的顶部和底部。
无论窗口大小如何,我都希望div占用所有空间。使用JavaScript轻松轻松,但有没有办法只使用CSS?
答案 0 :(得分:1)
http://jsfiddle.net/ZLrPF/基于我的James Dean粘性页脚http://mystrd.at/modern-clean-css-sticky-footer可以做到这一点。 IE7需要一点额外的爱,这可以做到。
修改强>
这是符合要求的IE7 +解决方案。
html {
height: 100%;
}
body {
margin: 0;
width: 100%;
height: 100%;
display: table;
}
#header-wrapper, #content-wrapper, #footer-wrapper {
display: table-row;
}
#header, #content, #footer {
display: table-cell;
}
#header, #footer {
height: 80px;
background-color: orange;
}
#content {
background-color: green;
}
<body>
<div id="header-wrapper">
<div id="header">header</div>
</div>
<div id="content-wrapper">
<div id="content">content</div>
</div>
<div id="footer-wrapper">
<div id="footer">footer</div>
</div>
</body>
答案 1 :(得分:0)
你应该使用粘性页脚。示例:http://ryanfait.com/sticky-footer/