CSS 100% 高度 + 带有静态高度的标题；答案

【问题标题】：CSS 100% height + header with static height;CSS 100% 高度 + 带有静态高度的标题；
【发布时间】：2010-10-22 03:29:54
【问题描述】：

我正在构建一个布局，其中包含一个高度为 40 像素的标题。在此标头下方有一个 SWF，它应该占用剩余的可用空间。

到目前为止，最好的解决方案是使用表格，第一行高度为 40 像素，第二行高度为 100% - 但这些行在 Internet Explorer 中仍然相加，导致滚动条出现 40 额外像素 -不应该是这样。

我尝试使用这个：http://www.456bereastreet.com/archive/200609/css_frames_v2_fullheight/ - 如果您的内容最终会向下推送，但其中包含 100% 的 SWF，它将占据整个页面或一半页面（取决于放置内容 div 中的 SWF 或作为内容 div 的 SWF）。

在我求助于 javascript 来处理这项业务之前，我想知道是否有人知道更好的解决方案？

【问题讨论】：

标签： css flash internet-explorer height

【解决方案1】：

尝试将您的标题设置为静态。所以它漂浮在主体上，并将主体设置为 100% 高度。然后在主体顶部设置 40px 的内边距。

【讨论】：

该排序工作，必须将 wmode="transparent" 添加到我的 swfobject 以继续显示标题，但现在我的 SWF 仍然坚持到页面顶部，如果标题和 swf位置设置为绝对。当设置为 relative 时，会发生相同的旧事件。
这适用于普通页面 - 但不适用于 SWF 设置，我使用了 javascript。还是谢谢

【解决方案2】：

将页脚强制放在页面底部的类似解决方案可能会起作用

    html, body{height:100%;margin:0;padding:0;}
    #head{height:40px;background:blue;}
    #wrapper{min-height: 100%;height: auto !important;height: 100%; margin: 0 auto -40px;background:red;}
    #content{}

<div id="wrapper">
<div id="head">
</div>
<div id="content">
</div>
</div>

【讨论】：