Bonjour, je rencontre actuellement un gros problème de conteneur, ils se chevauchent

Voici un petit screen du problème en question.


Voici le code HTML

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
 
<div id="conteneur">
<div id="conteneur-gauche">
<div class="head_block1">Rayons</div> <!-- tête du bloc rayon -->
<div class="body_block">
 
</div> <!-- corp du bloc rayson -->
 
<div class="head_block1">Nos Marques</div> <!-- tête du bloc marques -->
<div class="body_block">
 
</div> <!-- corp du bloc marques -->
</div>
 
<div id="milieu">
 
</div>
 
<div id="conteneur-droit">
<div class="head_block1">Login</div> <!-- tête du bloc login -->
<div class="body_block2">
 
</div>
 
<div class="head_block1">Newsletter</div> <!-- tête du bloc login -->
<div class="body_block2">												
 
</div>
</div>
</div>
Mon css:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
 
#conteneur
{
	background-color:#FFFFFF;
	width:980px;
	height:1708px;
 
 
	border-style:solid;
	border-color:green;
	border-width:2px;
}
 
#conteneur-gauche
{
	float:left;
	width:180px;
	padding-top:10px;
 
}
 
#conteneur-droit
{
	float:right;
	width:200px;
	padding-top:10px;
	padding-right:0px;
}
 
#milieu
{
	width:568px;
	background-color:#FFFFFF;
	margin: 0 0 0 181px;
	padding: 10px;
	border-style:solid;
	border-color:red;
	border-width:1px;
}
Je ne comprends pas pourquoi ça se déforme comme ça.