使子div与父元素的高度相同

Question

我的父div有一个类row-fluid，我希望它的子div与父div的高度相同。

<div class="row-fluid">    
    <div class="span2">            
    </div>      
    <div class="span7">              
    </div>       
    <div class="span3">                                       
    </div>
</div> 

这是我的css代码：

.row-fluid{
    float: left;
    width: 100%;
    background: blue;
}


.row-fluid > .span2{
    float: left;
    width: 23.076923076923077%;
    background: red;
}

.row-fluid > .span7{
    float: left;
    width: 48.5%;
    background: yellow;
}


.row-fluid > .span3{
    float: left;
    background: green;
}

这是说明我的div的图像：

蓝色区域是我的父div，红色，黄色和绿色区域对应于其子div。

Answer 1

为什么不设置父div的高度和孩子跨度的height: 100%？

.row-fluid {
  height: 300px;
}

.row-fluid > .span2,
.row-fluid > .span7,
.row-fluid > .span3 {
  height: 100%;
}

否则，你可能想看看this article。