Css如何使div与单个页脚的高度相同

Question

我有这个，我想动态填充这个div，但div面板行文本的高度不相等，我希望所有的高度都相同（将采用更大的高度），并且我希望页脚是相同的级别或行。我想了很多办法，但都想不通。

<div class="panel">
    <div  class=panel-row>
        <div class="panel-row-Text">
        </div>
        <div class="panel-row-footer">
        </div>
    </div>
    <div class=panel-row>
        <div class="panel-row-Text">
        </div>
        <div class="panel-row-footer">
        </div>  
    </div>
    <div class=panel-row>
        <div class="panel-row-Text">
        </div>
        <div class="panel-row-footer">
        </div>  
    </div>
</div>

Answer 1

我一直在使用这个JavaScript+jQuery解决方案。虽然很难看，但它可以与传统浏览器配合使用。

 // Equalize the height of front page boxes
function tuneFrontPage() {
    //
    $('.frontpage-promo .well').height(function () {
        var maxHeight = $('.frontpage-promo .well').max( function () { return $(this).height(); });
        return maxHeight;
    });
}

从这里取：https://stackoverflow.com/a/9189443/315168

CSS3 flexbox可能是一个现代化的解决方案http://www.html5rocks.com/en/tutorials/flexbox/quick/（从caniuse.com检查目标受众的兼容性）