Question

当弹出窗口打开并放大身体高度时

页脚应该到页面底部，但我找不到如何做到

这是我的代码

<style>
.div1{
width:360px;
height:240px;
overflow:auto;
overflow-x:hidden;
border:1px solid #f00;
position:absolute;
}
.black_overlay{ 
display: none; 
position: fixed; top: 0%; left: 0%; width: 100%; height: 100%;
background-color: black; z-index:1001; -moz-opacity: 0.8; opacity:.80; filter: alpha(opacity=80); }
.white_content { 
display: none; 
position: absolute; 
top: 25%; left: 25%; width: 50%;
padding: 16px; border: 16px solid orange; background-color: white; z-index:1002; overflow: auto; }
</style> 
<a onclick="document.getElementById
('light').style.display='block';document.getElementById('fade').style.display='block'" href="javascript:void(0)">open</a>  

<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br />

<div class="div1">
footer</div>
<div id="light" class="white_content">content
<br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br>
<a onclick="document.getElementById
('light').style.display='none';document.getElementById('fade').style.display='none'" href="javascript:void(0)">close</a>
</div> 
<div id="fade" class="black_overlay"></div>

感谢您阅读本文

任何建议都将受到赞赏。

Answer 1

<强> HTML：

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

<强> CSS：

#footer {
   position:absolute;
   bottom:0;
   width:100%;
   height:60px;   /* Height of the footer */
   background:#6cf;
}

Answer 2

#element
{
  position:fixed;
  bottom:0;
  z-index:50000; //Just in case :)
}

Answer 3

尝试以下任何链接：
http://ryanfait.com/resources/footer-stick-to-bottom-of-page/

http://blog.rajatpandit.com/2008/06/19/making-footer-stick-to-the-bottom-of-the-page/

Answer 4

尝试CSS属性vertical-align，如下所示：

#nameOfTheElement
{
    vertical-align: baseline;
}

如何在页面底部制作页脚div

4 个答案: