如何将固定高度的 div 与高度为 % 的 div 结合起来？答案

【问题标题】：How to combine fixed height divs with divs with height in %?如何将固定高度的 div 与高度为 % 的 div 结合起来？
【发布时间】：2011-05-25 07:35:38
【问题描述】：

我有 3 个垂直 div： topdiv - 固定高度为 100px； middlediv - 这应该填满页面的其余部分 bottomdiv - 固定宽度为 200px；

我希望将 div 放置在底部 div 位于屏幕底部，顶部位于顶部和 middlediv 应填充顶部和底部 div 之间的空间。

之前我`我们使用javascript来调整中间div的大小，但是当浏览器窗口调整大小时，中间div并没有改变。

有什么想法吗？

【问题讨论】：

标签： css html fixed

【解决方案1】：

其他人在类似问题上发布了this。我没有用过这个，但它确实帮助了他们。也许这会对你有所帮助。它使您可以选择在页面底部添加页脚，即使内容没有到达底部。试试看吧。

【讨论】：

【解决方案2】：

嗯，你可以使用min-height: x%，但是使用纯 CSS 不可能做到这一点，使用 jQuery，它看起来像这样：

$(document).ready(function()
{
wh = $(window).height();
md = $("middlediv").outerHeight()
if ( md+100 < h)
{
$("#middlediv").css("height", w-100 + 'px');
}

}

如果您想为窗口调整大小添加事件处理程序，这是可能的，并且基本上是相同的功能（或多或少）。

【讨论】：

【解决方案3】：

见456bereastreet，或试试this fiddle。

【讨论】：