1

我正在处理的页面位于www.joelchristophel.com。您可以通过检查大多数浏览器中的元素来查看源代码。我希望名为 main_body 的内容 div 填充标题和 main_bottom div 之间的区域。为此,我设置了顶部像素的位置以及底部像素的位置。但是,这不起作用,因为 main_body 只是扩展到内容的大小。我该怎么办?

编辑:最后, main_body 应该固定到位,溢出设置为滚动。

4

3 回答 3

0

我建议您手动设置每个 div 的高度,然后使用它。在#main .main_body 集的CSS中:

height = 500px; 

500 是您想要的任何值。然后将 main_bottom div 放入主体 div 中。

您还应该查看此链接: http: //matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks如果您想让子 div 与父 div 具有相同的高度这可能会对您有所帮助。

于 2013-05-17T06:30:26.100 回答
0

这是您要求的代码。

HTML

<div class="header">

</div>

<div class="content">
    Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!Content Comes Here..!!
</div>

<div class="footer">

</div>

CSS

.header
{
    width:100%;
    float:left;
    border:1px solid black;
    height:50px;
}

.content
{
    width:100%;
    float:left;
    border:1px solid black;
    margin-top:10px;
    height:auto:
}

.footer
{
    width:100%;
    float:left;
    border:1px solid black;
    height:50px;
    margin-top:10px;
}

尝试一下..!!

于 2013-05-17T06:38:09.160 回答
0

我最终使用百分比作为高度。并bottom: 20;main_bottom. 这就像一个魅力。

于 2013-05-19T02:31:44.123 回答