Css 2列布局，列高度固定在页脚上

我有一个基本布局，有两列和一个页脚，页脚根据哪一列的高度更长而变化

<div id="holder">
    <nav class="navbar navbar-default navbar-fixed-top"></nav>

    <div class="container">
        <div class="row">
            <div class="left col-md-8">
                Extends with content
            </div>
            <div class="right col-md-4">
                Extends with content
            </div>
        </div>
    </div>

    <div class="footer">
        Relative behaviour when the content of either columns is long enough. Sticks to the bottom when there is not enough content. 
    </div>

如果你同意的话，那么你可以优雅地用。将整个页面定义为具有最小高度，然后将列标记为弯曲以填充可用空间。不过，由于元素的嵌套，它不会那么简单

.row {
    overflow: hidden;
}

[class*="col-"] {
    margin-bottom: -99999px;
    padding-bottom: 99999px;
}