粘滯頁腳不工作

我想讓頁腳隨着內容出現而下降，但是我得到的是頁面中間的頁腳，正好在我的導航欄下面，我希望它在頁面底部，並自動推送的內容，我試過這個教程here 但我不知道是否做得對，顯然我沒有，因爲它不工作，所以有人可以幫助我嗎？粘滯頁腳不工作

<div id="wrapper"> 
<div id="banner"> 

    <img src="../img/banner2.png" width="1024" height="173" longdesc="../index.php" alt=""/>  </div> 
<div id="navigation"><?php include('C:/xampp/htdocs/legendofgames/includes/navbar.php'); ?> 


<div id="apDiv4"> 

<?php include('C:/xampp/htdocs/legendofgames/includes/menu_cat.php'); ?> 


</div> 


<div id="fb-root"></div> 

<div id="like"> 
<div class="fb-like-box"></div></div> 



<div id="apDiv2"> 



<!-- TemplateBeginEditable name="gamespace" --> 
    <h1>&nbsp;</h1> 
<!-- TemplateEndEditable --> 

    <!-- TemplateBeginEditable name="EditRegion4" --> 
    <!-- TemplateEndEditable --></p> 



</div> 

<div id="apDiv1"><img src="../img/lateralb2.png" width="209" height="592" alt=""/> 

</div> 

</div> 

<footer class="site-footer"> 


</footer>

的CSS代碼：

body { 

width:100%; 
height:100%; 
background-color: #FFF; 
background-image: url(../img/bg.png); 
background-repeat: repeat; 
} 

#wrapper { 
width: 1024px; 
margin-right: auto; 
margin-left: auto; 
min-height: 100%; 
top: 5px; 
margin-bottom: -200px; 
display: block; 

} 
.site-footer, .page-wrap:after { 
/* .push must be the same height as footer */ 
height: 200px; 
} 

.site-footer { 
background-image: url(../img/foot.png); 
}

來源

2013-07-11 Mariangela Vidotto

建議在'include'中使用相對路徑。另外，不要使用'include（）'，而是使用'require_once（）'來確保所有的外部文件都被加載。 – Raptor

感謝您的提示，我會做到這一點 –

看起來不錯，所有你需要做的是使用絕對定位和底部爲0.

.site-footer { 
    background-image: url(../img/foot.png); 
    position: absolute; 
    bottom: 0; 
    width:100% 
}

確保使用寬度：100％;因爲我確信它可以在以後的項目中爲您節省錯誤。

來源

2013-07-11 04:22:51 tannerwj

謝謝你的答案，但頁腳仍然留在屏幕中間。 –

使用絕對位置，使底部= 0

.site-footer { 
background-image: url(../img/foot.png); 
position: absolute; 
bottom: 0 ; 
left: 0; 
right: 0; 
}

來源

2013-07-11 04:05:05

謝謝你的回答，但頁腳仍然在屏幕中間 –

粘滯頁腳不工作

回答

相關問題