gpt4 book ai didi

html - 高度为 : 100%, 的 div-css 表格 div-rows 在 IE7 中不调整大小

转载 作者:太空宇宙 更新时间:2023-11-04 15:34:20 24 4
gpt4 key购买 nike

我想制作 100% 屏幕高度(最小值)的布局,包括页眉、正文和页脚……正文和页脚将具有硬编码高度,并且正文将具有 flex 以相应地调整大小…… . 如果内容为空或较少,将占据剩余的高度空间,如果内容已满,则将拉伸(stretch)并变大,将页脚 div 向下推。

它很好用,但在 IE7 中不行。

http://jsfiddle.net/swkrt/

<div class="content-holder">
<div class="header">header</div>
<div class="body">body</div>
<div class="footer">footer</div>
</div>

body, html {
margin: 0;
height: 100%;
}

.content-holder {
height: 100%;
display: table;
}

.content-holder div {
display: table-row;
}

.header {
height: 50px;
}

.footer {
height: 100px;
}

有什么建议吗?

最佳答案

试试这个:

<div class="content-holder">
<div class="header">header</div>
<div class="body">body</div>
<div class="footer">footer</div>
</div>

添加:

**.content-holder {
height: 100%;
width: 100%;
display: table;
}
.body{
height: 76.8%;
}**

关于html - 高度为 : 100%, 的 div-css 表格 div-rows 在 IE7 中不调整大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12969846/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com