Bonjour,

j'ai 3 divs à aligner horizontalement.
Chaque div est entouré de deux autres divs : un "header" et un "footer".

J'ai testé avec la propriété float: left; mais rien à faire, mes divs ne s'alignent pas comme il le faudrait

Mon 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
 
<div id="sous_content">
	<div class="home_cadre_header"></div>
	<div class="home_cadre">
	 ........
	</div>
	<div class="home_cadre_footer"></div>
	<div class="home_cadre_header"></div>
	<div class="home_cadre">
		..........
	</div>
	<div class="home_cadre_footer"></div>
	<div class="home_cadre_header_beige"></div>
	<div class="home_cadre_beige">
		............
	</div>
	<div class="home_cadre_footer_beige"></div>
</div>
Ma 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
 
.home_cadre_header {
	background-image: url(images/cadre_home_header.png);
	background-repeat: no-repeat;
	width: 321px;
	height: 8px;
}
 
.home_cadre {
	background-image: url(images/cadre_home_bg.png);
	background-repeat: repeat-y;
	width: 321px;
	height: 248px;
	padding: 0 5px;
}
 
.home_cadre_footer {
	background-image: url(images/cadre_home_footer.png);
	background-repeat: no-repeat;
	width: 321px;
	height: 7px;
}
En mettant des float: left;, les "header" et "footer" ne restent pas collés à leur div principal. Du coup tout se décale.

Comment dois-je faire ?