将页脚放在内容下似乎不工作 [英] Placing footer under content doesn't seem to work

问题描述

我尝试在我的内容下的网页上获取页脚，而不管内容的长度。由于某种原因，它不想要。

I'm trying to get the footer on a webpage under my content, regardless of the length of the content. For some reason, it doesn't want to.

HTML：

<div class="container">
    <div class="navigatie">
        <ul>
            <a class="navigatielink" href="index.php?page=home"><li class="navigatieli navigatie1">Home</li></a>
            <a class="navigatielink" href="index.php?page=info"><li class="navigatieli navigatie2">Info</li></a>
            <a class="navigatielink" href="index.php?page=agenda"><li class="navigatieli navigatie3 ">Agenda</li></a>
            <a class="navigatielink" href="index.php?page=fotos"><li class="navigatieli navigatie4">Foto's</li></a>
            <a class="navigatielink" href="index.php?page=contact"><li class="navigatieli navigatie5">Contact</li></a>
            <a class="navigatielink" href="index.php?page=gastenboek"><li class="navigatieli navigatie6">Gastenboek</li></a>
        </ul>
    </div>
    <?php
        //include the page content
        include_once ("content/".$_PAGE.'.php');
    ?>
</div>
<div class="clear"></div>
<div class="footer">

CSS ：

.container {
    width: 1000px;
    margin: auto;
    height: auto;
}

.clear {
    clear: both;
}
.footer {
    background-image: url("images/css/footer.png");
    height: 500px;
}

.navigatie {
    font-family: Rockwell;
    height: 45px;
    width: 980px;
    margin:auto;
    margin-top: 15px;
    font-size: 24px; 
    border: 1px solid #c3c3c3;
    background: #fff;
}

我已经试过给 .container 高度100％，并与定位播放，但我似乎无法获得此页脚下的内容，无论它的长度...

任何其他建议？

I already tried to give the .container a height of 100% and played with positioning, but I don't seem to be able to get this footer under the content regardless of the length of it...
Any more suggestions?

EDIT：

这是关于本网站

推荐答案

已经用于 class =navigatie我想你已经使用 float 属性。如果是这样，请将 overflow：hidden 添加到 .container 。例如

As you have not mentioned the style which has been used for class="navigatie" I guess you have used float property there. If so then add overflow:hidden to .container. For e.g.,

.container {
    width: 1000px;
    margin: auto;
    height: 100%; /* For IE6 */
    overflow:hidden /* For all other browsers*/
}

如果我的假设不正确，请提供 .contaier 中的元素的完整列表以及完整的样式表。

If my assumption is not right, then please provide the full list of elements present inside .contaier and also the full stylesheet.

编辑：
尝试此

 HTML:
   <div class="contentPart">
      <?php
        //include the page content
       include_once ("content/".$_PAGE.'.php');
      ?>
 </div>

CSS:
.contentPart {
     overflow:hidden;
     height:100%;
}

这篇关于将页脚放在内容下似乎不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！