在不使用正文标记的情况下使页脚在页面底部拉伸

Question

我已经研究了几个小时，现在尝试不同的解决方案，但它们似乎都没有对我有效，我不确定我做错了什么或者它是我正在使用的模板。我已经尝试过cssstickyfooter，但这对我来说也没有用。

我已经在页面中设置了背景图像，因此我无法使用将背景颜色设置为body标记的解决方案。 debug div需要一直延伸到页面底部。我已经使用chrome缩小了它并没有这样做。

这是css代码：

#rt-debug {
   background-color: #BF953F;
   padding-bottom: 15px;
   border-top: 4px solid #2A9685;
}

我在调试周围添加了一个footer2 div来测试cssstickyfooter解决方案

以下是该网站的链接： http://www.humanenergygroup.com/oil-and-gas-uk

Answer 1

最简单的方法是将以下内容添加到#rt-debug div：

#rt-debug {
    position: fixed;
    bottom: 0;
    width: 100%;
}

这将确保它始终是整页宽度以及保持＆＃34;粘性＆＃34;到了窗户的底部。

Answer 2

这有点像黑客，但你可以像这样使用jQuery：

var t = $("#rt-debug").offset().top;
var ih = window.innerHeight;
$("#rt-debug").css('height',ih-t + "px");

这是一个jsfiddle：http://jsfiddle.net/tLNCW/