Question

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

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

这是我正在使用的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);

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

Answer 1

嗯..你可以通过一些额外的CSS和position:absolute解决这个问题，如果你不反对的话。我添加了这些CSS样式：

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

这会导致右侧面板的.panel-footer始终粘在其底部，无论面板的高度如何。这里有一个JSFiddle来向您展示这是什么。

希望这有帮助！如果您有任何疑问，请与我们联系。

bootstrap 3：动态调整面板大小并将面板页脚保持在底部

1 个答案: