probleme de mise en page

voilà qui devrait fonctionner. Il faudra cependant que tu ajustes toi-même les couleurs et les dimensions...

feuille html

Code:

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
40
41
42
<html> 
<head> 
 
<link href "style.css" rel="stylesheet" type="text/css"> 
</head> 
<body> 
	<div class="baniere"> 
		<p align=center><img src="images/baniere.gif" width="600px" ></p> 
	</div> 
	<div class="page"> 
		<img src="images/haut_page.gif" width="970px" height="50px"> 
		<div class="txt_page"> 
			<div class="menu"> 
				<img src="images/haut_menu.gif" width="160px" height="50px"> 
				<div class="txt_menu"> 
					<a href="index.html">Accueil</a><br> 
					<hr color="red"> 
					<a href="genre.php" >Film trier par genre</a><br> 
					<a href="liste.php">Liste compléte des films</a><br><br> 
					Recherche d'un film :<br> 
					<input type=text name=recherche> 
					<input type=button name=valid value=OK size=3> 
					<br><br><br><br><br> 
				</div> 
				<img src="images/bas_menu.gif" width="160px" height="50px"> 
			</div> 
			<div class="donnees"> 
				<img src="images/haut_donnees.gif" width="640px" height="50px"> 
				<div class="txt_donnees"> 
					Bienvenue sur le site de la boutique CinéMania<br><br> 
					La boutique de location de film<br><br><br> 
					Horaire d'ouverture :<br><br> 
					<important>Du lundi au vendredi</important> : 9h00 - 12h00 et 14h00 - 19h00<br> 
					<important>Samedi</important> : 9h00 - 12h30 et 14h00 - 19h30 
				</div> 
				<img src="images/bas_donnees.gif" width="640px" height="50px"> 
			</div>
		</div> 
		<img src="images/bas_page.gif" width="970px" height="50px"></div> 
	</div> 
</body> 
</html>

feuille css

Code:

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
40
41
42
body { 
   background-color : black; 
} 
 
.page { 
   width: 750px; 
   height: auto; 
   position: absolute;    
   top: 50px; 
   left: 20px; 
} 
.txt_page { 
   background-image: url(images/page.gif); 
   background-color:red;
} 
 
.menu { 
	position:absolute;
   width: 150px; 
   height: auto; 
   top: 10px; 
   left: 10px; 
} 
.txt_menu { 
   background-image : url(images/menu.gif); 
   padding-left: 5px; 
   text-align: center; 
   line-height: 30px; 
   background-color:yellow;
} 
 
.donnees { 
  width: 600px; 
   height: auto; 
   margin-top: 50px; 
   margin-left: 250px; 
} 
.txt_donnees { 
   background-image : url(images/menu.gif); 
   padding-left: 5px; 
   background-color:green;
}

merci francis mais cette solution ne peut pas marcher pour mon cas car pour la page d'accueil, mon bloc menu est plus long que le bloc données mais dans les autres pages, mon bloc données est plus grand que mon bloc menu.

Ce qui serait bien, c'est que tu fasses un petit shéma avec commentaires de ce que tu veux réellement, car là vraiment ça devient difficile de savoir.

De toute façon, à ta place, je recommencerais tout de zéro, en utilisant le css pour l'affichage de toutes tes images de fond, en mettant un doctype à ta page, etc..
Car corriger une page mal conçue fait perdre plus de temps que de la recommencer entièrement.

indépendemment de ce que te dis spirou, qui n'a pas vraimnt tort,...

si ma solution fonctionne pour toutes tes pages sauf la première, ajoute des balises bidon dans les données de ta première page pour agrandir ce bloc
par bidon je veux dire un code de ce genre :

Code:

 

aux endroits que tu veux. Si tu en mets plusieurs, ton bloc données s'agrandira pour finir par être plus grand que ton bloc menu