Aiuto con impostazione layout

salve ragazzi!

sto preparando l'header per un sito.

solo che mi sono impantanato con i position...

questo è il codice css che uso:
codice:
BODY {
	margin: 0;
	padding: 0;
	background-color: #FFFFFF;
	text-align: center;
	font-family: Tahoma, Arial; 
	font-size: 0.8pc;
	color: #000000
}

a { text-decoration: none} 
a:hover { text-decoration: underline}

#topstriscia1 {
	width: 750px;
	height: 10px;
	left: 0;
	top: 0;
	margin: 0 auto;
	background-color: #7F7F7F;
}
#toplogo {
	width: 200px;
	height: 85px;
	left: 0;
	top: 0;
	background-color: #FFFFFF;
}
#topbanner {
	width: 550px;
	height: 85px;
	left: 0px;
	top: 0px;
	text-align: center;
	background-color: #FFFFFF;
}
#topstriscia2 {
	width: 750px;
	height: 10px;
	left: 0;
	top: 0;
	margin: 0 auto;
	background-color: #EEEEEE;
}
e questo invece il codice html per inserire i div nella pagina..
codice:
<div id="topstriscia1"></div>
<div id="toplogo">[img]imgs/logo.gif[/img]</div>
<div id="topbanner">XXX</div>
<div id="topstriscia2"></div>
come vedete le posizioni sono "stranissime", infatti nell'immagine allegata è descritto come vorrei che uscisse il tutto...

magari è una cosa da niente, però ci sto uscendo pazzo!

grazie a chiunque mi possa aiutare!