I read some tutorials about how to set up a 3 column page in css, but I am having some issues with how the <div>'s are lining up. On the right bar, there is a space between the nav bar and column, and on the left there is a space between the column and footer.

Here is my style:
Code CSS:
html, body {
	margin: 0;
	padding: 0;
	font-family: Arial;
	font-size: 13px;
}
 
#header {
	background-image: url('images/logo_bg.jpg');
	height: 195px;
	width: auto;
}
 
#navbar {
	background-image: url('images/nav_bg.jpg');
	height: 43px;
	width: auto;
	padding: 0px 10px 0px 10px;
	line-height: 43px;
}
 
#leftcolumn {
	background: #666666;
	width: 150px;
	float: left;
	height: 100px;
}
 
#content {
	background: #FFFFFF;
	width: auto;
	float: left;
	height: 100px;
}
 
#rightcolumn {
	background: #666666;
	width: 150px;
	float: right;
	height: 100px;
}
 
#footer {
	background: #CCCCCC;
	width: auto;
	height: 125px;
	clear: both;
}