更新：http://jsfiddle.net/dSkJb/19/
为了澄清，页脚应位于页面的底部，页面应始终具有100％的高度，因此中间行应相应调整。页脚没有任何重叠，页脚不应重叠任何内容。基本上，如果你有一个高度为100％的双行表，你可以很容易地完成这个任务。
这是一个问题，一个100％高度的div在一个div内，100％，一些文字被撞倒。
http://jsfiddle.net/sandraqu/dSkJb/8/
有没有办法让内部div的高度相对于包含div的高度？
下面的原帖
我试图让两个内柱具有100％的高度，而不是打扰粘性页脚。到目前为止，我的粘性页脚与主容器有关，但是我很难将＃content，＃col1和#col2的高度与#container的高度相匹配，而不会丢失粘性页脚。
不同文章建议使用身高：自动;身高：100％;和最小高度（对于ie6），但我发现身高：自动;干扰内在的高度。还有对位置的建议：相对，浮点数，显示：内联。选择太多了？
答案 0 :(得分：1)
Cross Browser Solution。但理论上，您可以使用任何方法将列放在中间。我刚刚使用了display: table;和display: table-cell;。但是包装div不需要display: table;就可以工作，所以你可以使用float技巧，或者虚拟列，或者圣杯，或者你想要的任何东西，并使它与IE 6+兼容。我只是懒得立即实施其中任何一个。主要目标已经完成，我将让你研究具体细节。 ：）
答案 1 :(得分：0)
首先，在这种情况下，我不确定你的“粘性页脚”是什么意思。粘性页脚通常会粘贴到位，而页面的其余部分会滚动。但是，您的示例似乎将页脚“粘贴”到容器的底部，而不是视口的底部。这是正确的行为吗？
其次，根据您的处理方式，“100％高度”列有几个选项：
1）假它
使用看起来像您想要的列的背景图像。在body，container或content上重复此操作，具体取决于您希望如何设置样式。有关详细信息，请参阅A List Apart - Faux Columns或Google“CSS Faux Columns”。
如果您想要一个实际的粘性页脚，这是最好的解决方案。
2）定位元素
将position: relative添加到content div，将position: absolute; height: 100%;添加到内容较少的列。包含更多内容的列将用于增加content元素的高度。另请注意，您可能希望为包含更多内容的列添加边距，以便将其从内容较少的列中移除。
这应该允许您的列一直推到页脚。如果您的页脚应位于容器的底部而不是视口的底部，则这是更好的解决方案。
有关此技术的更多详细信息，请参阅我的jsFiddle。
答案 2 :(得分：0)
有点不清楚您希望潜在溢出如何在中心内容区域工作，以及您想要容纳多长时间的浏览器。对于IE8 +，我相信这符合您的需求：http://jsfiddle.net/dSkJb/51/。这是一个非常简短的内容示例：http://jsfiddle.net/dSkJb/52/。
也许有一些严重的针对性调整IE7可以适应（我花了太多时间试图让它工作，接近几次，但是没能完全得到它，所以我给了向上）。 IE6肯定不适用于此。