Probleme espace vertical entre deux div

	<div class="zone_gauche" >
		
		<div class="logo">
		</div>
		
		<div class="menu">
			</br>
			</br>
			</br>
			</br>
				<li> <a href="google.com">accueil </a> </br> </li>
				<li> <a href="google.com">news </a> </br> </li>
				<li> <a href="google.com">forum </a> </br> </li>
				<li> <a href="google.com">calendrier </a> </br> </li>
				<li> <a href="google.com">fiche des jeux </a> </br> </li>
				<li> <a href="google.com">inscription </a> </br> </li>
				<li> <a href="google.com">espace membre </a> </br> </li>
				<li> <a href="google.com">liste membres </a> </br> </li>
				<li> <a href="google.com">articles </a> </br> </li>
				<li> <a href="google.com">livre d'or </a> </br> </li>
				<li> <a href="google.com">nous défier </a> </br> </li>
				<li> <a href="google.com">me contacter </a> </br> </li>
		</div>
		
	
		<div class="stats">
			</br>
			</br>
			nggnng
		</div>
		
		<div class="info_gene">
		</div>
		
	
	</div>

.zone_gauche
{
background-color: white;
width: 200px;
height:auto;
float: left;
border: 3px;
border-style: groove;
}


.logo
{
background-image:url("Img/logo.png");
width: 200px;
height:254px;
}


.menu
{
background-image:url("Img/menu.png");
padding: 50px; 
background-repeat: no-repeat;
font-family: arial , sans-serif;
width: 200px;
height:400px;
list-style-type: circle;
}


.stats
{
background-image:url("Img/stats.png");
padding: 50px; 
background-repeat: no-repeat;
font-family: comic , sans-serif;
width: 200px;
height:300px;
list-style-type: circle;
}