Bonjour,


Je souhaiterai comprendre comment faire une page web avec des div redimensionnalble suivant la taille de la fenêtre.

La page web contient une banniere en haut, et un menu sur la gauche.
La banniere et le menu ne formant qu'une seule image.
Le corps de la page doit se situer en dessous de la banniere et juste à droite du menu.

Je souhaiterai ainsi que le corps de ma page suit intelligemment le redimensionnement de l'image (constituant la baniere et le menu).

J'ai dans un premier temps la structure suivante en 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
 
	<body>									
 
		<div id="PageContent">	
 
			<div id="BarreNavigation" style="width:100%;border: 1px solid black;padding-left:1.5%"><!-- div contenant la barre de navigation -->				
				<p>a</p>
			</div>
 
			<div id="FondPage" style="left:0;top:0;border: 1px solid red;position: fixed;z-index: -20;width: 100%;height: 100%;" > <!-- div contenant le fond de la page = bannière + menu -->														
				<img id="bg" style="position: fixed;z-index: -20;width: 100%;height: 100%;" src="bg.jpg" />
 
				<div id="BodyContent" style="border: 1px solid green; width:90%;margin-left:auto;position: relative;position: fixed;z-index: -20;width: 100%;height: 100%;"><!-- contenu issu de confluence -->		
					<div id="pp" >d</div>
				</div><!-- fin div BodyContent -->	
 
			</div><!-- fin div font de page -->		
 
		</div>
 
		<div id="PiedPage" style="border: 1px solid blue;">					
 
		</div>
	</body>