Hey everyone,
im having problems with positioning a few divs heres my problem:

I'm trying to get the header div to spread across the screen at the top (width = 100%) and at a fixed height of 100px. I also want to get the banner div to be floated to the left of the header div and also be inside the header div and have the search div positioned to the far right and inside the header div. Finally i want the actual search bar (searchbox div) at the bottom of the header div. But no matter how i try it i cant seem to get all these to work at the same time.

Heres my HTML
HTML Code:
<div class="header">
	<div class="banner">
		<h1 class="title">Title</h1>
	</div>
	<div class="search">
    <div class="searchbox">
		<form action="search.php" method="get">
        <label>Search</label>
        <input  name="search" type="search" />
        <input type="submit" />
		</form>
    </div>
	</div>
</div>
and here is the CSS:

Code:
div.header{
	border:1px #000 solid;
	width:auto;
	height:100px;
	margin-top:5px;
	float:left;
}
div.banner{
	float:left;
	height:100px;
	width:auto;
}
div.search{
	display:block;
	border:1px #000 solid;
	float:right;
	margin-right:5%;
	width:auto;
	height:100px;
	position:absolute;
}
div.searchbox{
	position:relative;
	bottom:0;
}
Thanks