Bonjour,

Voilà, j'ai un site qui contient un bandeau (banniere dans mon css), une barre, un menu et un corps.
En cherchant à droite à gauche, je suis presque arrivé à mes fins concernant la mise en page que voici :
Nom : Capture1.JPG Affichages : 92 Taille : 108,2 Ko

Seulement, quand j'agrandis ou rétrécis la page, j'ai un soucis :
la banniere et la barre ne se comportent pas de la même manière que le corps : bannière/barre se décalent en fonction de la marge droite (retrecissement/agrandissement) tandis que le corps reste fixe.
Exemples :
Nom : Capture2.JPG Affichages : 74 Taille : 126,4 KoNom : Capture3.JPG Affichages : 76 Taille : 93,7 Ko

Donc j'aimerai que la banniere et la barre se comportent comme le corps, comme ça aucun de mes éléments n'est influencé par le redimensionnement. Comment dois-je procéder ?
Ci-dessous, mon css et mon html.
Merci d'avance

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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
<html>
<head>
     <title>Portail AUTOCAPTURE</title>
     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	 <meta http-equiv="refresh" content="60">
	 <link rel="stylesheet" href="style/style.css" type="text/css" />
</head>
<body>	
			<div id="menu">	
				<a href="index.php" alt="Accueil" title="Accueil">
					<div class="menu" id="logo"></div>
				</a>
				<div class="menu" id="menu1" onclick="afficheMenu(this)">
					<a href="tbo.php">TBO</a>
				</div>
				<div id="sousmenu1">
					<div class="sousmenu">
						<a href="tbc.php">TBC</a>
					</div>
					<div class="sousmenu">
						<a href="tbm.php">TBM</a>
					</div>
					<div class="sousmenu">
						<a href="tbs.php">TBS</a>
					</div>
					<div class="sousmenu">
						<a href="trn.php">TRN</a>
					</div>
					<div class="sousmenu">
						<a href="trs.php">TRS</a>
					</div>
					<div class="sousmenu">
						<a href="tbf.php">TBF</a>
					</div>
					<div class="sousmenu">
						<a href="tee.php">TEE</a>
					</div>
				</div>
 
				<div class="menu" id="menu2" onclick="afficheMenu(this)">
					<a href="tbe.php">TBE</a>
				</div>
				<div id="sousmenu2">
					<div class="sousmenu">
						<a href="tme.php">TME</a>
					</div>
					<div class="sousmenu">
						<a href="tmf.php">TMF</a>
					</div>
					<div class="sousmenu">
						<a href="mbis.php">MBIS</a>
					</div>
					<div class="sousmenu">
						<a href="2e.php">2E</a>
					</div>
				</div>
			</div>
			<a href="index.php" alt="Accueil" title="Accueil" id="lien_banniere"><div id="banniere">Portail Autocapture</div></a>
 
			<div id="barre">TBO - TBE</div>	
 
			<div id="corps" class="corps">
				<div class="picture">
					<table class="tab_picture">
						<tr>
							<td class="tab_lien"><a href="lien" title="Accès au dossier des captures"><?php echo $display_filename_TBC; ?></a></td>
						</tr>
						<tr>
							<td class="tab_image"><img src="lien" id="tbc" title="Double-cliquez pour agrandir"></td>
						</tr>
					</table>
				</div>
				<div class="picture">
					<table class="tab_picture">
						<tr>
							<td class="tab_lien"><a href="lien" title="Accès au dossier des captures"><?php echo $display_filename_TBM; ?></a></td>
						</tr>
						<tr>
							<td class="tab_image"><img src="lien" id="tbm" title="Double-cliquez pour agrandir"></td>
						</tr>
					</table>
				</div>
				<div class="picture">
					<table class="tab_picture">
						<tr>
							<td class="tab_lien"><a href="lien" title="Accès au dossier des captures"><?php echo $display_filename_TBS; ?></a></td>
						</tr>
						<tr>
							<td class="tab_image"><img src="lien" title="Double-cliquez pour agrandir"></td>
						</tr>
					</table>
				</div>
				<div class="picture">
					<table class="tab_picture">
						<tr>
							<td class="tab_lien"><a href="lien" title="Accès au dossier des captures"><?php echo $display_filename_TRN; ?></a></td>
						</tr>
						<tr>
							<td class="tab_image"><img src="lien" id="trn" title="Double-cliquez pour agrandir"></td>
						</tr>
					</table>
				</div>
			</div>
 
			<script src="js/jquery.js"></script>
			<script src="js/display_doubleclick.js"></script>
</body>
</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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
html {
	height:100%;
}
 
body {
	width:100%;
	height:100%;
	margin:0px auto;
	background-image:url(../img/fond.png);
	padding-top:5px;
}
 
div#banniere {
	/*padding-top:50px;*/
	text-align:center;
	background-color:#7F8585;
	height:118px;
	margin-left:20px;
	margin-right:20px;
	font-weight:bold;
	color: white;
	font-size:40px;
	line-height:110px;
	font-family:Rockwell;
}
 
#lien_banniere{
	text-decoration:none;
}
 
div#logo {
	height:102px;
	width:143px;
	background-image:url(../img/logo.jpg);
	background-repeat:no-repeat;
	margin-top:24px;
	margin-left:3px;
}
 
div#menu {
	/*width:14%;*/
	float:left;
	margin-left:20px;
}
 
div#barre {
	padding-top:10px;
	text-align:center;
	background-color:#FFD552;
	height:27px;
	margin-left:20px;
	margin-right:20px;
	font-weight:bold;
	color: #142E3F;
	font-size:30px;
	line-height:18px;
	font-family:Rockwell;
}
 
div#corps {
	padding-left:40px;
	text-align:center;
	background-image:url(../img/contenu.gif);
	margin-left:120px;
	margin-right:20px;
	/*height:1000px;*/
	position:absolute;
	overflow:hidden;
	float:right;
	width:1083px;
}
 
div#menu1 {
	margin-top:7px;
}
 
/* MENU LATERAL */
 
.menu a {
	display:block;
	line-height:30px;
}
 
.menu, .sousmenu{
	text-align:center;
}
 
.menu{
	height:35px;
	width:100px;
	padding:1px 0;
	background-image:url(../img/menu.jpg);
	color:#fff;
}
.sousmenu{
	height:35px;
	width:100px;
	padding:1px 0;
	background-image:url(../img/menu.jpg);
	color:#fff;
}
 
.menu a{
	display:block;
	width:100%;
	height:100%;
	color:#fff;
	font-family:arial,sans-serif;
	font-size:20px;
	font-weight:bold;
	text-decoration:none;
	background-image:url(../img/menu.jpg);
	line-height:40px;
}
.sousmenu a{
	display:block;
	width:100%;
	height:100%;
	color:#fff;
	font-family:arial,sans-serif;
	font-size:16px;
	font-weight:bold;
	text-decoration:none;
	background-image:url(../img/sousmenu.jpg);
	display:block;
	line-height:35px;
 
}
.menu a:hover, .sousmenu a:hover, .menu a:active, .sousmenu a:active, .menu a:focus, .sousmenu a:focus{
	background:#FF7714;
}
 
 
.picture a {
	display:inline-block;
	text-decoration:none;
	color:black;
}
 
.picture {
	float:left;
	text-align:center;
	margin: 25px 25px 25px 0px;
}
 
.picture table {
	border-collapse: collapse;
	background-color: white;
}
 
td.tab_lien {
	border: 2px solid white;
	background-color: #FFFA72;
	text-align: center;
}
 
td.tab_lien a{
	color: #383C3D;
	font-weight:bold;
 
}
 
td.tab_image img{
	width: 507px; 
	height: 285px;
}
 
td#tab_image img{
	width: 1014px; 
	height: 570px;
}