CSS 引导程序。div 100% 其父元素的高度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14819425/
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
bootstrap. div 100% height of its parent element
提问by Andrewski
With bootstrap I have difficulties with creating div 100% heightof its parent element.
使用引导程序，我很难创建 div 100%height的父元素。
I have .row-fluiddiv and two .spandivs in it.
First .span9has more content, then second .span3has navigation and empty space under. I want to fill that empty space with color. I want that stretch all way down where content of .span9reaches.
我有.row-fluiddiv 和两个.spandiv。第一个.span9有更多的内容，然后第二个.span3有导航和下方的空白空间。我想用颜色填充那个空白空间。我想要一直延伸到内容.span9到达的地方。
回答by David Taiaroa
Here's a CSS solution, based on adding a large padding and an equally large negative margin to each column, then wrapping the entire row in in a class with overflow hidden. It works well cross-browser as well
这是一个 CSS 解决方案，基于为每列添加一个大的填充和同样大的负边距，然后将整行包装在一个隐藏溢出的类中。它也适用于跨浏览器
CSS
CSS
.col{
margin-bottom: -99999px;
padding-bottom: 99999px;
background-color:#ffc;
}
.col-wrap{
overflow: hidden;
}
HTML
HTML
<div class="container">
<div class="row-fluid col-wrap">
<div class="span9 col">
... span content ...
</div><!-- end span 9-->
<div class="span3 col">
... span content ...
</div><!-- end span 3-->
</div><!-- end row-fluid -->
</div>
You can see it working at http://jsfiddle.net/panchroma/y3BhT/
