将页脚放置在窗口或页面底部，以较大者为准

Question

我目前正在开发一个网站，要求将页脚放置在窗口底部或页面内容的底部，以较低者为准。我尝试使用height: 100%方法，但这会导致问题。

我还有一个position: fixed标题，以及我内容上的一些填充（以像素为单位）。此外，内容的高度可能会在页面加载后使用（使用手风琴等），所以我想知道是否有一种纯CSS方式将页脚定位到窗口底部或文档底部，同时仍允许像素填充等。

以下是HTML的概述结构：

<header></header>
<div class="content">
    <footer></footer>
</div>

我还整理了一个小提琴来演示CSS目前是如何工作的：http://jsfiddle.net/LY6Zs/。很遗憾，我无法更改HTML结构（即从footer中删除.content元素。

Answer 1

首先需要在包含所有内容的容器div之后

.container
{
min-height:100%;
position:relative;
margin:0 auto;
}

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