为什么创建页面时这些div不出现?为什么它们会出现在屏幕上?

A List Apart . 我发现 this article 使用固定位置创建具有固定标题、左面板和主面板的布局时。我在一个母版页中实现了这个想法,但现在得到了非常奇怪的结果:当页面呈现时,标题和主div根本不会出现在IE7中。当我调整到最小的程度时,所有的东西都会正确地就位。FireFox没有这样的问题。

html { overflow: hidden; }
body { overflow: hidden; padding: 0; margin: 0; width: 100%; height: 100%; font: 0.8em Verdana, sans-serif; line-height: 1.25; color: #333; background-color: White; }
#coachheader { padding: 0; margin: 0; position: absolute; top: 0px; left: 0px; width: 100%; height: 96px; overflow: hidden; }
#side { padding: 0; margin: 0; position: absolute; top: 100px; left: 20px; bottom: 20px; overflow: auto; width: 200px; }
#main {padding: 0; margin: 0; position: absolute; top: 100px; left: 240px; right: 20px; bottom: 20px; overflow: auto; }
a.SM { color:#666666; text-decoration:none; padding-left: 10px; padding-right:10px; margin-left:2px; margin-right:2px; vertical-align:middle; }
img.SM { height: 20px; vertical-align:middle; }

以下是HTML:

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Coach.master.cs" Inherits="FitnessCompanion.Coach" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>My Title</title>
    <link rel="stylesheet" href="../../stylesheetforstaff.css" type="text/css" />
    <!--[if lt IE 7]>
    <style type="text/css">
        #side { height:expression(document.body.clientHeight-120); }
        #main { height:expression(document.body.clientHeight-120); width:expression(document.body.clientWidth-260); }
    </style>
    <![endif]-->
</head>
<body runat="server" id="body1">
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
    <div id="coachheader">  <!-- This div does NOT show up initially -->
        <div style="text-align:left; float:left; margin-left:6px;">
            <img src="/images/BSDILogoWeb.png" alt="BSDI" />
        </div>
        <!-- The Menu -->
        <div style="float:right; margin-right:6px;">
           <a menu table...>
        </div>
    </div>
    <div id="side">
        <menu output for the side - this div shows up!>
    </div>
    <div id="main">
        <!-- Main Page - this Div does not show up. Contents: just a table -->
        <div>
        <asp:contentplaceholder id="ContentBody" runat="server">
        </asp:contentplaceholder>
        </div>
    </div>
    </form>
</body>
</html>

即使在我基本上删除了所有内容之后,这个变体也不能在这个页面上工作! 站点的这一部分位于子目录中,但 那个

任何帮助都将不胜感激!再一次,我觉得我离它有1毫米的距离:它在Firefox中运行良好,只要我在任何方向上调整窗口的大小,无论多么轻微,它看起来都很好。