Salve,

io voglio dividere l'header della mia pagina web in due sezioni.

In sostanza voglio che nell'header della pagina ci sia a sx il logo e a dx un menu (fatto di immagini).
Questo è quello che vorrei
comevorrei

Questo è quello che viene
come viene



questo è l'index
codice:
<body >
		
		
	<div id="container">
        <div id="header">
			<div id="logo"> 
				[img]img/TecWebLogo.png[/img]
			</div>
			
			<div id="navigation">
			<ul>
				<li onload="logInit('uname', 'upass', 'logbtn');">
					<div id="login">
						<label for="uname">User name</label>
						<input id="uname" type="text" value="user" />
						<label for="upass">User password</label>
						<input id="upass" type="text" value="password" />
						<label for="logbtn">Login button</label>
						<input id="logbtn" type="button" value=" " />
					</div>
				
				[*]<a href="inc/registra.inc.php"><img src"img/reg.png" alt="Nuova registrazione">
Registrazione</a>
				[*]<a href="inc/recuperapwd.inc.php"><img src"img/pwd.png" alt="Recupera password">
Recupera Password</a>
				[*]<a href="index.php"><img src"img/home.png" alt="Home">
Home</a>
				
			</div>
		
		</div>
        
		
		<div id="content"></div>
        <div id="footer"></div>
    </div>
mentre questo è il foglio css(in parte)

codice:
<style type="text/css">

html,body{
	margin:0; 
	padding: 0
	}
body{
	font-family: arial,sans-serif; 
	font-size: 76%
	}
div#container{
	position: relative; 
	width: auto;
	height:100%
	}
div#header{
	top:10px;
	background: #E0FFFF;/*Azzurro ghiaccio*/
	
	float: left;
    width: 45%;
    width: 49%;
    width: 45%;
    padding: 0 2%
	}
#logo{
	
	display:inline
	
	}
#navigation{
	
	background-color:#FFE0F6; 
	border:solid;
	padding:0.4em;
	color: #fff;

	}
#navigation ul{
	margin-left: 0;
	padding-left: 0;
	display: inline;
	} 

#navigation ul li {
	margin-left: 0;
	margin-bottom: 0;
	padding: 2px 15px 5px;
	
	list-style: none;
	display: inline;
	}