Im trying to make dynamics divs. I have on container (#container) div thats wraps the whole content. What i would like to do is having 2 divs inside of the main div. One of the inner div should display all info (#content) The last div (#border) should work like an border fading out (using background-image) to the default background. I have mange to get inner div to dynamiclly change the size of the outer div (#content). However the second inner div (#border) dosent get the same height as ther first one. I have also tried to insert i border-div into the content div but not getting the right look because of the title image. I need help with this one...

Cheers

HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>Boxes</title>
	<style type="text/css">
	body { 
		width: 100%;
		height:100%;
		margin:0;
		padding:0;
		clear:both;
	}
	#container {
		position:relative;
		float: left;
		height:100%;
		width: 100%;
		background:url(bg.jpg) repeat; 
		top:0px;
		left:0px;
		right:0px;

	}
	#content {
		width: 650px;
		position:relative;
		float: left;
		height:100%;
		background-color:#FFE6F2;
	}
	#menu { 
		width: 150px;
		position: relative;
		float: left;
		padding-left: 5px;
		background-color:#009966;

	}
	#substance {
		width: 490px;
		padding-right: 5px;
		position:relative;
		float: left;
		background-color:#006666;

	}
	#border {
		left: 650px;
		width: 10px; 
		position:absolute; 
		background:url(shade.jpg);
		background-repeat: repeat-y;
		float: left; 
		height:100%;
	}
	#fillout {
		width: 50px; 
		position:relative; 
		background-color: #abc673; 
		float: left; 
		height:100%;
	}

	</style>
</head>
<body>
<div id="container">
	<div id="content"><img src="title.jpg"  />
		<div id="menu">some menu</div>
		<div id="substance"><h2>This is my world</h2><p>Welcome! Fill out this text with what ever you like to, just. It has to be alot otherwise the page height wont be over the default 100%...</p></div>
	<div id="border"></div>
	
</div>
</body>
</html>