-1

我正在尝试设置一个基本布局，无论用户设置什么分辨率，页眉和页脚都会在页面宽度上进行。

我已经解决了这个问题，但现在我遇到了一个问题，即主容器 div 无法正确扩展高度以包含其中的 div。无论您更改什么高度或最小高度样式，它似乎都只会扩展到某个高度，然后就不会再进一步​​了。

这是基本结构：

<div id="page">
    <div id="content">
    </div>

</div>
<div id="footClear"></div>

<div id="footer">
</div>

页脚代码是强制页脚粘在页面底部，无论主容器的高度如何（id="page"）

我对这些部分的 CSS 是：

#page {
margin:0 auto;
width:1000px;
background:red;
padding:0px;
min-height:100%;
position:relative;
margin-bottom:-47px;
}

#content {

}

#footer {
width:100%;
height:22px;
position:relative;
margin:0 auto;
background:#000000;
text-align:center;
padding-top:3px;
font-size:12px;
}

#footClear {
    height:22px;
    clear:both;
}

如果您想看一下，这里有指向我网站的链接：www.therapyoracle.co.uk/new

可以看到页面 div 是红色的，并且没有进行向下页面。

4

3 回答 3

0

如果你把身高从你身上拿走，body这将为你解决如下问题

body {
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size: 14px;
    padding: 0;
    margin: 0;
    }
于 2012-05-11T12:46:56.750 回答
0

在您的实时站点上，#page已height: 100%设置，这导致了问题。

它来自你的ie6.css！这就是您尝试使其仅在 IE6 中加载的方式：

<!—[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="assets/css/ie6.css" />
<![endif]—&gt;

上面 HTML 中的连字符是错误的。用这个替换那个 HTML：

<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="assets/css/ie6.css" />
<![endif]-->

ie6.css然后只会在 IE6 中加载，而不是在所有浏览器中加载，您的问题将得到解决。

于 2012-05-11T12:48:20.207 回答
0

ie6.css中的删除margin-bottom:-47px;和删除#page {height: 100%;}

于 2012-05-11T12:51:58.053 回答