Как сделать колонтитул DIV всегда на нижней части страницы

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

Попробуйте любой из этих ссылок:
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 2

Попробуйте CSS свойство вертикального выравнивания, например:

#nameOfTheElement 
{ 
    vertical-align: baseline; 
} 

Answer 3

HTML:

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

CSS:

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

Answer 4

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