Bonjour,

Tentant de faire un site en Responsive web design, je n'arrive pas à effectuer un alignement vertical et horizontal malgré de multiples lectures.
Mon HTML est :
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
<!DOCTYPE html>
<html>
<head>
    <title>RWD</title>
    <meta name = "viewport" content="width=device-width"/>
    <link rel = "stylesheet" href = "RDW.css">
</head>
 
<body>
 
<div class ="container">
	<div class ="block haut_gauche"> haut gauche </div>
	<div class ="block haut_centre"> <img src="Images/chien.jpg"></div>
	<div class ="block bas"> Mon texte </div>
</div>
 
 
</body>
</html>
tandis que le CSS est :
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
body
	{
		background:pink ;
		font-size:100%;
	}
 
.container{width:1366px; margin:0 auto;}
.block{float:left;}
.block:after{clear:left;}
 
 
.haut_gauche
	{
		background:blue;
		height:100px;
		width:200px;	/* largeur zone de texte */
		line-height:normal; /* on rétablit le line-height */
		text-align:left; /* ... et l'alignement du texte */
	}
.haut_centre{background:grey;height:100px;width:1166px;}
.bas{background:white;height:300px;width:1366px;}
 
 
img.centre
	{
		vertical-align: 100%;
	}
Je précise que je souhaite aligner "haut gauche" dans le rectangle bleu en haut à gauche et l'image "chien.jpg" dans son rectangle gris.

Merci d'avance de m'éclairer.