CSS 具有高度的父 div：100% 不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12897958/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Parent div with height: 100% doesn't work
提问by Adam
Possible Duplicate:
CSS - 100% height doesn't work
可能重复：
CSS - 100% 高度不起作用
I have 3 divs, the div-1is a background and div-2and div-3are two containers (one for text and one for photo).
我有3div秒，div-1是背景和div-2和div-3是两个容器（一个用于文本，一个用于照片）。
HTML:
HTML：
<div id="div-1">
<div id="div-2"></div>
<div id="div-3"></div>
</div>
CSS:
CSS：
#div-1 {
width: 100%;
height:100%;
padding: 40px 0;
margin:0;
}
#div-2 {
width: 500px;
margin: 0;
float: left;
}
#div-3 {
width: 200px;
margin: 0;
float: right;
}
This is what I get:
这就是我得到的：
Why height: 100%doesn't work?
为什么height: 100%不起作用？
采纳答案by Ives.me
This can work
这可以工作
<div id="div-1">
<div id="div-2"></div>
<div id="div-3"></div>
<div style="clear:both"></div>
</div>
回答by Web Designer cum Promoter
Remove height: 100%;in #div-1and add position: absolute;. It will work just fine.
删除height: 100%;在#div-1和添加position: absolute;。它会工作得很好。
回答by Roman
you need to add clear flow after you applying floating properties to elements, more about it here: http://www.quirksmode.org/css/clearing.html
在将浮动属性应用于元素后，您需要添加清晰的流程，更多关于它的信息：http: //www.quirksmode.org/css/clearing.html
回答by Simon Carlson
The height of #div-1 is 100% but 100% of nothing, as it relies on the parent tags height I believe. Try setting your body to 100% height in css.
#div-1 的高度是 100% 但 100% 没有，因为它依赖于我相信的父标签高度。尝试在 css 中将你的身体设置为 100% 的高度。
