Javascript 引导3：动态重新调整面板大小，并保持面板底部的页脚

我正在调整面板的大小，使其与左侧列的高度相同

我的大小调整得很好，但面板的页脚卡在顶部。解决这个问题的最好办法是什么

以下是我正在使用的js：

$(document).ready(function(){
    //Panels have a margin-bottom
    $topRightCol = $('.homepage-top-right-col .panel');
    $leftColHeight = $('.homepage-top-left-col').height() - 
        parseInt($topRightCol.css('margin-bottom')) -
        parseInt($topRightCol.css('borderBottomWidth'));
    $topRightCol.height($leftColHeight);

---

当我试图像这样设置column类本身的高度（'.homepage top right col）.height（$leftColHeight）时，它并没有增加高度，所以我修改了面板。

好吧……如果你不反对的话，你可以用一点额外的CSS和

位置：绝对值来解决这个问题。我添加了以下CSS样式：

.homepage-top-right-col > .panel{
    position:relative;
}
.homepage-top-right-col .panel-footer{
    position:absolute;
    width:100%;
    bottom:0;
}

这会导致右侧面板的
.panel footer
始终粘在底部，而不管面板的高度如何。下面是一个例子，向您展示这一成果

希望这有帮助！如果您有任何问题，请告诉我。
这样做很有效，但右侧的大面板高度不完全相同，看起来有点短。请确保将预览窗格扩展到全宽（以便它停止使用移动样式），然后刷新页面。您的JavaScript目前只对高度进行一次评估，而对于移动样式，面板的组合高度要小一些。如果仅在页面加载后才展开预览窗格，则高度将不匹配。