Hi, the problem is that I want the sidebar to stretch to the bottom of the page. When the page is small enough (doesn't have a scroll bar), everything is ok. But whenever the page stretches with a scroll bar, the sidebar only reaches till the end of the first 'page'.

This is a link where I have the problem.
http://sval.be/actueel.php?type=page&id=2

With source code (replaced irrelevant code with {...}):
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> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Persbericht Nederland: "Afvoeren slootmaaisel goed voor boer en milieu" </title> 
 
<link href="/CSS/css.css" rel="stylesheet" type="text/css" /> 
 
</head> 
 
<body> 
<div id="main"> 
 	<div id="side"> 
    		<div id="logo_nav"> 
     		<a href="../index.html"><img src="/Svallogovzw copy.png" alt="SVAL logo" width="200" height="200" border="0" align=							"absmiddle" class="border" /></a> 
    		</div> 
        	<div id="nav">{navigation links}</div> 
  		</div> 
	<div id="banner"><h1>SVAL</h1><h2>Samenwerking voor Agrarisch Landschap vzw</h2></div> 
   	<div id="content"> 
   	  	<div id="nav_actueel">	<a href=/actueel.php?type=page&id=1>Vorige</a><a href="/actueel.php?type=table&id=1">Home</a><a href=/actueel.php?type=page&id=3>Volgende</a></div> 
 
        	<div id=content_actueel_p><table> 
        <tr> 
          <th>Persbericht Nederland: &quot;Afvoeren slootmaaisel goed voor boer en milieu&quot;, 3 juni 2008</th> 
        </tr> 
        <tr> 
        <td>
		{text}
	</td> 
        </tr> 
      </table>            
 
   	</div> 
</div> 
 
 
 
</html>
And Css file (only relevant id's):
Code:
html, body {
	height:100%;
	background-color:#FBFAA7;
	margin:0;
	padding:0;
}
#main {
	width:967px;
	min-height:100%;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	position:absolute;
	margin:0 auto;
}
#side {
	width:200px;
	min-height:100%;
	background-color:#F9F76E;
	margin:0 auto;
	position:absolute;
	bottom:0px;
	top:0px;
}
#logo_nav {
	margin:0px;
}
#nav {
	width:200px;
}
#nav a{
	text-decoration:none;
	text-align:center;
	display:block;
	background-color:#FBFAA7;
	border:1px #44D637 double;
	width:180px;
	margin:10px;
	color: #44D637;
}
#banner {
	top:0px;
	background-color:#F9F76E;
	left:200px;
	position:absolute;
	width:767px;
	height:200px;
}
#banner h1{	
	margin-top:50px;
	text-align:center;
	font-size:36px;
	color:#44D637;
	text-transform:uppercase;
	text-decoration:underline;
	text-shadow:#FBFAA7;
}
#banner h2{
	text-align:center;
	font-size:24px;
	color:#44D637;
	text-shadow:#FBFAA7;
}
#content_actueel_p  {
	position:absolute;
	right:0px;
	bottom:0px;
	left:200px;
	top:250px;
}
#nav_actueel {
	position:absolute;
	width:767px;
	margin:0 auto;
	left:200px;
	right:0px;
	height:50px;
	top:200px;
	text-align:center;
}
#nav_actueel a{
	display:inline;
	padding:3px;
	text-decoration:none underline;
	font-size:large;
	text-transform:uppercase;
	color:#000;
}
#nav_actueel a:hover{
	color:#44D637;
}
#nav_actueel {
	position:absolute;
	width:767px;
	margin:0 auto;
	left:200px;
	right:0px;
	height:50px;
	top:200px;
	text-align:center;
}
#nav_actueel a{
	display:inline;
	padding:3px;
	text-decoration:none underline;
	font-size:large;
	text-transform:uppercase;
	color:#000;
}
#nav_actueel a:hover{
	color:#44D637;
}
#content_actueel_p table {
	width:90%;
	heigh:500px;
	border:0;
	cellpadding:0;
	cellspacing:0;
}
#content_actueel_p table th {
	bgcolor:#F9F76E;
	text-align:center;
	font-size:large;
	border-bottom: solid 3px #44D637;
}
#content_actueel_p table td{
	text-align:left;
}