html - 试图模仿 Lamborghini.com 的布局无济于事

Question

我试图模仿具有固定页眉和页脚的布局，其内容适合两者之间，无需 javascript 或使用表格。你可以在这里看到我在找什么

Answer 1

其实这很简单。这是完整的代码，只需复制并粘贴即可。

感谢 Jeremy (http://stackoverflow.com/questions/206652/how-to-create-div-to-fill-all-space-between-header-and-footer-div)。

<style type="text/css">
html, body 
{ 
    height: 100%;
    padding: 0;
    margin: 0; 
} 

#header
{
    height: 100px;
    color: #FFF;
    background: #000;
}

#content
{
    min-height: 100%; 
    height: auto !important; /*Cause footer to stick to bottom in IE 6*/
    height: 100%; 
    margin: 0 auto -100px; /*Allow for footer height*/
    vertical-align:bottom;
    color: #FFF;
    background: #333;
}

#footer
{
    height: 100px; 
    color: #FFF;
    background: #000;   
}

#divider 
{
    height: 100px; /*Divider must be same height as Footer */
}

</style>

<div id="content">
    <div id="header">
        Header
    </div>

    Content Text

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