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>
&nbsp;&nbsp;<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>