css - Twitter Bootstrap Css根据父行流体修复孩子的高度

Question

有没有更好的方法将孩子的高度固定到主要父母的高度？
我试过了，但它对我不起作用：

.child {
    background: none repeat scroll 0 0 #5B6567;
    border-radius: 5px 0 0 0;
    display: inline-block;
    float: left;
    line-height: 30px;
    padding-top: 6px;
    position: relative !important;
    text-align: center;
    width: 12%;
    height:100%
}

<div class="row-fluid">
    <div class="child">
        child
    </div>
</div>

jsfiddle http://jsfiddle.net/WTmt6/1/ 检查我想让灰色的左边 div 固定红色一个大 .media div 的高度 ps：我不能使用固定/px 尺寸我只使用百分比/%我的布局

Answer 1

我仍然不确定我是否理解问题...首先，删除填充，child因为它会导致height:100%. 您应该在内部 div 中添加填充：

.inner {
    padding:6px;
}

<div class="child">
    <div class="inner">child</div>
</div>

高度 100% 工作正常。这是一个 3 个孩子（其中两个是相等的）的例子，漂浮在一个浮动的父母中没有问题：http: //jsfiddle.net/qRPYt/7/

如果您仍然遇到问题，请发布row-fluidjsfiddle 甚至更好的 CSS。