Problem z wyrównaniem divów w jednej linii!

Otóż chodzi o to ze divy nie chcą się wyrównać!

Nie da się tak wyjaśnić więc pokaże!

Jest tak:

A chciał bym tak:

Podam też kody

HTML/PHP:

<div class="nav">
			 <div id="Witajuser">
			 <?php 
		 echo "<h1>Witaj ".$_SESSION['user'].'!<h1>'; 
		 ?>
		 </div>
		 <div id="jakiemail">
		 <?php 
		 echo "<h3>E-mail: ".$_SESSION['email']; 
		 ?>
		 </div>
		 <h3 id="wylogujesz"><a  href="logout.php">Wyloguj Się</a><h3> <div id="zegar"></div>
		</div>

CSS:

.nav
{
	color: Yellow;
	background-color: 	#1E90FF !important;
	margin: 0px;
	border: 0px;
	padding: 0px;
	text-align: center;
	width: 100%;
	font-family: AR CENA;
	display:table;
    margin-right: auto;
	margin-left: auto;
	
}
#zegar
{
	float:left;
	display:table;
    margin-right: auto;
	margin-left: auto;
	background-color: blue;
	display: inline-block;
}
#wylogujesz
{
	float:left;
	display:table;
    margin-right: auto;
	margin-left: auto;
	background-color: blue;
	display: inline-block;
}
#Witajuser
{
	float:left;
	display:table;
    margin-right: auto;
	margin-left: auto;
	background-color: blue;
	display: inline-block;
}
#jakiemail
{
	float:left;
	display:table;
    margin-right: auto;
	margin-left: auto;
	background-color: blue;
	display: inline-block;
}

No i jak to uzyskać? (obrazek nr.2)