html - 带有侧边栏的棘手的粘性页脚

Question

我希望在带有全高侧边栏的页面内容区域内放置一个粘性页脚。

这是我正在处理的页面的副本： http ://www.lavenderstone.co.uk/stackoverflow/

我过去曾多次成功地使用过http://ryanfait.com/sticky-footer/ ，并且使用了一种使用 %'s 的方法。我遇到的问题的转折点是有一个 100% 高度的侧边栏（绿色），我需要在内容 div （灰色）底部的页脚（橙色）。

我不能将页脚 div 放在其父 div 的底部，也不能强制其兄弟的高度为 100% 减去页脚的高度。我都试过了都没有用。

我可以将页脚放在页面底部，但这会破坏侧边栏的设计。任何人都可以帮忙吗？我几乎想求助于javascript！

Answer 1

将此样式添加到 content-wrap 元素

#content-wrap{
    height:100%;
}

将您的页脚元素放在您的内容元素中并添加此样式；

#footer{
    position:absolute;
    bottom:0;
}