CSS/HTML-页脚位置不正确_Css - Fatal编程技术网

CSS/HTML-页脚位置不正确

css

CSS/HTML-页脚位置不正确,css,Css,无法理解为什么我的页脚不在我的“container”DIV中从#innerContainer中删除min height，另一种方法是添加float:left到您的#容器问题是#容器没有浮动，因此在正常页面“流”中。这允许.footer在#容器的上方和外部“浮动”。如果同时浮动#容器，则.footer应显示在预期位置您可能还必须浮动所有的“container”div，包括#container，.footer，和#innercainer，thx@Jasper，需要跟进的新问题。。。考虑到窗口高

无法理解为什么我的页脚不在我的“container”DIV中

从

#innerContainer

中删除

min height

，另一种方法是添加

float:left到您的#容器

问题是#容器
没有浮动，因此在正常页面“流”中。这允许.footer
在#容器的上方和外部“浮动”。如果同时浮动#容器
，则.footer
应显示在预期位置
您可能还必须浮动所有的“container”div，包括#container
，.footer
，和#innercainer，thx@Jasper，需要跟进的新问题。。。考虑到窗口高度和该窗口中的内容…页脚向上浮动到内容的底部，带有“innerContainer”。。。。我尝试添加：底部：0；然而，这并没有像预期的那样将页脚向下推。。。还有其他技巧可以实现这一点吗？我不建议使用一些调整来使页脚一直向下移动到容器中。在我看来，最佳实践是让页脚根据内容大小自由流动。这将防止网站正文和页脚之间出现任何不必要的额外空间。
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
</head>

<body>

<div id="container">

    <div id="innerContainer">
        <div class="leftcol">
        </div><!--/leftcol-->                                   


        <div class="centercol-home">
        </div><!--/centercolHome-->


    </div><!--/innercontainer-->


    <div class="footer">
     </div>    
</div><!--/container-->

</body>
</html>

html {
    font-family: Arial, sans-serif;
    height:100%;  
}


body{
    margin: 0 auto;
    padding: 0; 
    font-size: 12px;
    height:100%;
    /*min-width:995px;*/
    background:url(/_images/body-bg.jpg) top center no-repeat;

}

#container {
    width:995px;
    margin: 0 auto;
    padding: 0;
    height:100%;
    position:relative;
    background:#fff;
    border:3px solid #0068b3;
}



/* IE6 */
* html #container {
    height:100%;
}

#innerContainer {
    width:985px;
    min-height:100%;
    padding:0 5px 5px 5px;
    margin:0 0 25px 0;
    /*float:left;*/
    background:#fff;
}

.footer {
    clear:both;
    float:left;
    width:974px;
    text-align: center;
    /*bottom:0;*/
    padding-top:5px;
    padding-bottom:5px;
}