How to force <div> to be at the bottom of page
How to force <div> to be at the bottom of page in order so when page does not fit in window of browser, you can scroll all page.
I does this <div> but when page does not fit in window of browser, you can only scroll content above this <div> and this <div> is visible always without scrooling. How to do in order so:
- when page fits in window of browser, <div> is at the bottom of page;
- when page does not fit in window of browser, you scroll all page (<div> is display normally)
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><%@ Page Language="C#" ValidateRequest="false" %><meta content="text/html; charset=utf-8" http-equiv="Content-Type" /><title>kamil</title><style type="text/css">
p {
font-family: Arial;
font-size: medium;
margin-left: 10px;
margin-right: 10px;
}
a {
text-decoration: none;
margin-left: 5px;
margin-right: 5px;
}
a.active {
font-weight:bold;
}
a:hover {
text-decoration: underline;
}
</style></head>
<body style="margin: 0px; min-height:100%; background-color: white;"><div><p>Tekst</p>
<p>Tekst</p>
<p>Tekst</p>
<p>Tekst</p>
<p>Tekst</p></div>
<div style="background-image: url('../menu.png'); bottom: 0px; right: 0px; left: 0px; position: fixed;">
<p style="line-height: 31px;"><a href="../pl/index.aspx" class="active">Strona główna</a>
<a href="../pl/contact.aspx">Kontakt</a> <a href="../pl/links.aspx">Linki</a>
<a href="../pl/ttm.aspx" class="additional">Zdjęcia z Tatr</a> <a href="../pl/jokes.aspx">Kawały</a>
<a href="../pl/rss.aspx">Źródło RSS</a> <a href="../en/">English</a></p>
</div>
</body>
</html>
