Décalage du bloc global (qui prend en compte toute la page) [Résolu]

serpolet · 01/09/2011, 12h57

Bonjour tout le monde,

Je suis heurté aujourd'hui à un problème étrange, qui est le déplacement du bloc global (le bloc qui correspond à toute ma page, ma bannière ainsi que tout le contenu) d'une page à une autre.

Après plusieurs manipulations, c'est en effaçant le texte dans les balises HTML que les blocs ne se déplacent enfin plus. j'ai donc essayé de trouve ce qui n'allait pas étant que je pense que cela vient du css, mais en vain, je ne vois pas où est l'erreur.

je vais donc vous donner le code, d'une page et d'une autre où il y a justement le déplacement de ce bloc:

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
 
<body>
	<div id="global">
    	<div id="banniere"><img src ="images/ban1.png" alt ="" name="IMG_1" width ="900px" height ="102px" border=0 usemap ="#IMG_1Map" />
</div>
<div id="contenu">
        	<div id="bandeau">
            </div>
            <div id="menu">
            	<ul>
                	<li><a href="index.html">Accueil</a></li>
                    <li><a href=".html">Produits</a></li>
                    <li><a href=".html">Services</a></li>
                    <li><a href=".html">Réalisations</a></li>
                    <li><a href=".html">Tous au num&eacute;rique</a></li>
					<li><a href="contact.html">Contact/Devis</a></li>
                </ul>
            </div>
			 <div id="menu1">
            	<ul>
                	<li><a href="AZ.html">AZ </a></li>
                    <li><a href="BIP.html">BIP</a></li>
                    <li><a href="HDR.html">HDR</a></li>
                    <li><a href="ROUDIER.html">ROUDIER</a></li>
                    <li><a href="AMS.html">AMS</a></li>
					<li><a href="JPP.html">JPP </a></li>
					<li><a href="PAT.html">PAT </a></li>
                    <li><a href="TAB.html">TAB</a></li>
                    <li><a href="MIDIVER.html">MIDIVER</a></li>
                    <li><a href="MICKATP.html">MICKA TP</a></li>
                    <li><a href="JEANETBARTHES.html">J&B </a></li>
					<li><a href="BROSSE.html">BROSSE</a></li>
					<li><a href="SME.html">SME</a></li>
					<li><a href="LACOMBE.html">LACOMBE</a></li>
                </ul>
            </div>
            <div id="fond">
 
 
 
				 <div id="bte2">
 
                        	<div id="bte2_1">
							     <p><h1>BIP</h1></br>
								 <h2>Une équipe à votre service depuis 1993</h2></br>
 
                                 <u>Du lundi au vendredi:</u></br></br>
 
                                 <ul id="puces">
				                 <li>9h-12h  / 14h-18h</li></br>
			                     </ul>
 
	                             <u>Le samedi:</u></br></br>
 
                                <ul id="puces">
				                <li>9h-12h</li>
			                    </ul>		  </br></br>
 
 
 
 
 
                                <h3><b>1er Centre regional de maintenance de terminaux numériques</b></h3></br></br>
 
 
				                  <img src ="images/bip.jpg" alt ="" name="IMG_1" width ="640px" height ="480px" border=0 usemap ="#IMG_1Map" />	</br></br></br>			 
 
 
                                <h3><u>Activité:</u></h3></br>
 
			                     </br></br>

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
 
 
<div id="bte2_1">
							     <p> <h1>HDR</h1></br>
 
<b> Sarl HDR : Maçonnerie générale</br></br>
 
 
M. XXX </br>
XXX </br>
XXX</br></br>
 
Tél. : XX.XX.XX.XX.XX</br>
 
</br>
Mail : XXX@XXX.XX
</br></br>
 
 
								 </b></p>
 
                            </div>

CODE 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
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
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
 
	color: #666666;
	font-weight: bold;
	text-decoration: none;
}
 
a:hover {
	color: #ac2700;
	text-decoration: underline;
}
 
body {
	color: #666666;
	font: 12px Arial, Helvetica, sans-serif;
	background: url(images/pierre.jpg) repeat;
}
 
.clear {
	clear:both;
}
#bte2_1 h2{
font-family: Helvetica, sans-serif;;
	color: #2d7529;
	text-align: left;
	font-size: 18px;
	font-weight: normal;
	padding-bottom: 10px;
}
#bte2_1 h3{
font-family: Helvetica, sans-serif;;
	color: #2d7529;
	text-align: left;
	font-size: 15px;
	font-weight: normal;
	padding-bottom: 10px;
}
 
 
 
 
 
#global {
	width: 924px;
	margin: 0 auto;
	padding-top: 18px;
 
}
 
#banniere {
 
	width: 900px;
	height: 102px;
	background: url(images/#) no-repeat 0px 0px;
	}
 
 
 
#contenu {
	padding-top: 15px;
 
 
}
 
#bandeau{
	background:url(images/content_top.png) no-repeat 0px 0px;
	height: 12px;
}
 
#menu {
	background: url(images/.png) repeat-x;
	position: absolute;
	width: 100%;
	left: 0;
}
#menu ul {
	list-style: none;
	padding-left: 70px;
	display: block;
	width: 900px;
	margin: 0 auto;
}
 
#menu ul li {
	list-style: none;
	padding-left: 0px;
	display: inline;
}
 
#menu ul li a {
	text-decoration: none;
	display: block;
	float: left;
	color: #0a3d1b;
	font: 14px Arial, Helvetica, sans-serif;
	width: 15%;
	height: 56px;
	line-height: 56px;
	text-align: center;
 
}
 
#menu ul li a:hover {
	text-decoration: none;
	background: url(images/menu_hover.png) top center no-repeat;
}
#menu1 {margin-top:56px;
	background: url(images/menu_bg.png) repeat-x;
	position: absolute;
	width: 100%;
	left: 0;
}
#menu1 ul {
	list-style: none;
	padding-left: 0px;
	display: block;
	width: 900px;
	margin: 0 auto;
}
 
#menu1 ul li {
	list-style: none;
	padding-left: 0px;
	display: inline;
}
 
#menu1 ul li a {
	text-decoration: none;
	display: block;
	float: left;
	color: #ffffff;
	font: 10px Arial, Helvetica, sans-serif;
	width: 7%;
	height: 56px;
	line-height: 56px;
	text-align: center;
 
}
 
#menu1 ul li a:hover {
	text-decoration: none;
	background: url(images/menu_hover1.png) top center no-repeat;
}
 
 
 
#fond{
	background: #ffffff;
	padding: 54px 13px 0 13px;
 
}
 
#imagefixe {
	background: url(images/header_bg1.jpg) no-repeat top left;
	height: 241px;
}
 
#ombre {
	background: url(images/shadow.png);
	height: 41px;
}
 
#ombre1 {
	background: url(images/shadow1.jpg);
	height: 17px;
}
 
 
.bte-ombre {
	background: url(images/shadow2.png) no-repeat top left;
	padding: 20px 12px 0 12px;
 
}
#bte1{
width:900px;
height:auto;
 
}
ul#puces li {
		list-style: none;
		padding: 5px 0 3px 15px;
		background: url(images/bouton1.png) no-repeat left center;
	}
 
.marge {
margin-left: 1.4em;
}
 
#bte2{
	padding-top: 20px;
}
 
 
 
 
 
 
#bte2{margin-top:60px;
	padding-top: 13px;
	padding-bottom: 5px;
}
 
#bte2 h1{
	text-align: left;
	padding-left: 10px;
}
 
#bte2_1{
	float: left;
	padding-left: 10px;
	width: 900px;
}
#bte11{
	margin-top:-90px;
 
}
#bte112{
	margin-top:0px;
 
}
 
 
 
#basdepage {
	background:url(images/content_bot.png) no-repeat 0px 0px;
	height: 8px;
}
 
#ombre_basdepage{
	background: url(images/shadow3.png) no-repeat top left;
	height: 39px;
}
 
 
 
#bassite{
	text-align: center;
	padding: 20px;
}
 
#bassite p, #bassite a{
	color: #fff;
	font-weight: normal; 
}

Merci d'avance pour vos éventuelles réponses.

Kaamo · 01/09/2011, 14h09

d'une page et d'une autre ? Car tel qu'il est posté là, le bloc global se met bien au milieu de la page, il n'y a pas l'air d'avoir un soucis quelconque.

Peux-tu nous donner l'intégralité des deux pages ?
Tout le code source de la première page
Et tout le code source de la seconde (balises HTML incluses)

Et il faut éviter de mettre les données perso (mail, téléphone etc

)

serpolet · 01/09/2011, 14h53

Merci pour la rapidité de ta réponse!
Et en ce qui concerne les coordonnées, ce n'est pas grave qu'elles soient diffusées étant donnée que ce sont des entreprises.

Et si justement faut pas les divulguer pour faire de la publicité, j'en suis désolé.

Je vais te donner les deux pages de codes:

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
 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Les Associés du Bâtiment</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="styles.css" rel="stylesheet" type="text/css" media="screen" />
<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
<link href='http://fonts.googleapis.com/css?family=Lobster+Two&v1' rel='stylesheet' type='text/css'>
		<link href="page.css" rel="stylesheet" type="text/css" />
</head>
<body>
	<div id="global">
    	<div id="banniere"><img src ="images/ban1.png" alt ="" name="IMG_1" width ="900px" height ="102px" border=0 usemap ="#IMG_1Map" />
</div>
<div id="contenu">
        	<div id="bandeau">
            </div>
            <div id="menu">
            	<ul>
                	<li><a href="index.html">Accueil</a></li>
                    <li><a href=".html">Produits</a></li>
                    <li><a href=".html">Services</a></li>
                    <li><a href=".html">Réalisations</a></li>
                    <li><a href=".html">Tous au num&eacute;rique</a></li>
					<li><a href="contact.html">Contact/Devis</a></li>
                </ul>
            </div>
			 <div id="menu1">
            	<ul>
                	<li><a href="AZ.html">AZ </a></li>
                    <li><a href="BIP.html">BIP</a></li>
                    <li><a href="HDR.html">HDR</a></li>
                    <li><a href="ROUDIER.html">ROUDIER</a></li>
                    <li><a href="AMS.html">AMS</a></li>
					<li><a href="JPP.html">JPP </a></li>
					<li><a href="PAT.html">PAT </a></li>
                    <li><a href="TAB.html">TAB</a></li>
                    <li><a href="MIDIVER.html">MIDIVER</a></li>
                    <li><a href="MICKATP.html">MICKA TP</a></li>
                    <li><a href="JEANETBARTHES.html">J&B </a></li>
					<li><a href="BROSSE.html">BROSSE</a></li>
					<li><a href="SME.html">SME</a></li>
					<li><a href="LACOMBE.html">LACOMBE</a></li>
                </ul>
            </div>
            <div id="fond">
 
 
 
				 <div id="bte2">
                    <h1>BIP</h1></br>
                        	<div id="bte2_1">
							     <p><h2>Une équipe à votre service depuis 1993</h2></br>
 
 <u>Du lundi au vendredi:</u></br></br>
            <ul id="puces">
				<li>9h-12h  / 14h-18h</li></br>
			</ul>
	<u>Le samedi:</u></br></br>
            <ul id="puces">
				<li>9h-12h</li>
			</ul>		  </br></br>
 
 
 
 
 
<h3><B>1er Centre regional de maintenance de terminaux numériques</b></h3></br></br>
 
 
				<img src ="images/bip.jpg" alt ="" name="IMG_1" width ="640px" height ="480px" border=0 usemap ="#IMG_1Map" />	</br></br></br>			 
 
 
 
<h3><u>Activité:</u></h3></br>
<ul id="puces">
				<li>Fourniture et installation d&#146;antennes hertziennes et paraboliques, pour les particuliers ou la collectivité (sur le secteur du grand Biterrois)</li>
				<li>Service après vente toutes marques téléviseurs. Réparations effectuées dans les locaux de l&#146;entreprise par un technicien spécialisé</li>
				<li>Centre d&#146;échange et de maintenance Canal +, Canalsat, Numéricable et Orange TV</li>
				<li>Référence en tant qu&#146;installateur d&#146;antennes traditionnelles et satellites auprès des enseignes telles que : DARTY &#150; BUT &#150; AUCHAN &#150; CONFORAMA...</li>
				<li>Référence auprès des gestionnaires d&#146;immeubles ou Syndics dans la région de Béziers (34), pour l&#146;entretien, la rénovation et la remise en état des </li>
	      <span class="marge"></span>      installations collectives
			  </ul>
 
			  </br></br>
 
 
 
			  </br></br></br>
<b> S.A.R.L B.I.P au capital de 50 000 &#128; </br></br>
R.C 93 B 00246  RM 39129997100013 APE 524 L</br></br>
 
17  Rue Ferdinand HEROLD </br>
34500 Béziers</br></br>
 
Tél. : 04 67 11 02 02 </br>
Fax : 04 67 11 07 62</br>
</br>
Mail : bipbeziers@wanadoo.fr
</br></br>
site internet : <a href="http://www.biptv.eu">www.biptv.eu </a></b>
 
 
								 </p>
 
                            </div>
 
 
                </div> 
 
                <div id="bte1">
 
                    </div>
 
                    <div class="clear"></div>
                </div>
                <div id="box2">
 
 
 
                </div>
 
            </div>
            <div id="basdepage"></div>
            <div id="ombre_basdepage"></div>
 
 
 
		</div>
 
		<div id="bassite">
			<p>Copyright © 2011 <a href="http://www.instant-design.fr/" title="">Instant-design.fr</a> Tous droits réservés </p>
 
		</div>
 
 
 
 
        </div>
    </div>
   </body>
</html>

ET l'autre page:

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
 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Les Associés du Bâtiment</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="styles.css" rel="stylesheet" type="text/css" media="screen" />
<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
<link href='http://fonts.googleapis.com/css?family=Lobster+Two&v1' rel='stylesheet' type='text/css'>
		<link href="page.css" rel="stylesheet" type="text/css" />
</head>
<body>
	<div id="global">
    	<div id="banniere"><img src ="images/ban1.png" alt ="" name="IMG_1" width ="900px" height ="102px" border=0 usemap ="#IMG_1Map" />
</div>
<div id="contenu">
        	<div id="bandeau">
            </div>
            <div id="menu">
            	<ul>
                	<li><a href="index.html">Accueil</a></li>
                    <li><a href=".html">Produits</a></li>
                    <li><a href=".html">Services</a></li>
                    <li><a href=".html">Réalisations</a></li>
                    <li><a href=".html">Tous au num&eacute;rique</a></li>
					<li><a href="contact.html">Contact/Devis</a></li>
                </ul>
            </div>
			 <div id="menu1">
            	<ul>
                	<li><a href="AZ.html">AZ </a></li>
                    <li><a href="BIP.html">BIP</a></li>
                    <li><a href="HDR.html">HDR</a></li>
                    <li><a href="ROUDIER.html">ROUDIER</a></li>
                    <li><a href="AMS.html">AMS</a></li>
					<li><a href="JPP.html">JPP </a></li>
					<li><a href="PAT.html">PAT </a></li>
                    <li><a href="TAB.html">TAB</a></li>
                    <li><a href="MIDIVER.html">MIDIVER</a></li>
                    <li><a href="MICKATP.html">MICKA TP</a></li>
                    <li><a href="JEANETBARTHES.html">J&B </a></li>
					<li><a href="BROSSE.html">BROSSE</a></li>
					<li><a href="SME.html">SME</a></li>
					<li><a href="LACOMBE.html">LACOMBE</a></li>
                </ul>
            </div>
            <div id="fond">
 
 
 
 
 
				 <div id="bte2">
 
                        	<div id="bte2_1
							     <p>"><h1>JPP SERVICES</h1></br><h2>Pensez avenir avec JPP Services</h2></br>
 
<b>Vous souhaitez réaliser des projets de plomberie, de chauffage ou solaire ?</b></br></br>
 L'entreprise JPP Services à Béziers, créée en 1997, vous aide à mener à bien vos travaux. Agréés PGN-PGP, PGN Confort, Qualisol, Qualigaz et avec la licence soudure gaz avant compteur, nous vous garantissons un travail de qualité.</br>
 Notre équipe est soumise régulièrement à des formations aux dernières techniques.</br></br>
<b> Contactez-nous, un technicien se rend à votre domicile afin de vous conseiller et de mener à bien vos projets. N'hésitez pas à nous contacter pour tous renseignements.		</b>						 
 
			  </br></br></br>
<b> 
JPP SERVICE</br>
 
10 rue Marcel Prévost</br>
34500 Béziers</br></br>
 
Tél. : 04 67 49 31 01 </br>
 
 
</br>
site internet : <a href="http://www.jppservices.fr/">www.jppservices.fr/ </a></b>
 
 
								 </p>
 
                            </div>
 
 
                </div> 
 
                <div id="bte1">
 
                    </div>
 
                    <div class="clear"></div>
                </div>
                <div id="box2">
 
 
 
                </div>
 
            </div>
            <div id="basdepage"></div>
            <div id="ombre_basdepage"></div>
 
 
 
		</div>
 
		<div id="bassite">
			<p>Copyright © 2011 <a href="http://www.instant-design.fr/" title="">Instant-design.fr</a> Tous droits réservés </p>
 
		</div>
 
 
 
 
        </div>
    </div>
   </body>
</html>

Je comprends vraiment pas ce décalage...c'est la première fois que ça me fait ça!:/

fab256 · 01/09/2011, 15h14

Le fichier CSS fourni n'est pas complet, il manque du texte au début!
Les deux pages semble centré sans aucun décalage, peut être il faudrait nous donner l'adresse direct du site pour voir mieux.

serpolet · 01/09/2011, 15h22

D'accord je fais ça ce soir normalement, étant donné que c'est pas moi qui l'héberge, je ne peux l'héberger maintenant..

Merci pour toutes vos réponses en tout cas!

Kaamo · 01/09/2011, 17h09

Oui, l'accès direct au site sera mieuxpour évaluer le problème.

De plus, il y a plusieurs fichiers css dotn on n'a pas accès :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<link href="styles.css" rel="stylesheet" type="text/css" media="screen" />
<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
<link href="page.css" rel="stylesheet" type="text/css" />

serpolet · 01/09/2011, 19h31

re bonsoir,

Non les pages css que t'as figuré sur le forum ne sont pas actives mises à part pour celle "styles.css" que je vous ai montré, du moins une partie tout à l'heure.

Bon, j'ai créé un site et j'ai mis l'interessé en sous-domaine de façon à ce que vous puissiez visualiser la situation.

http://www.biptv.eu/lesassociesdubatiment/BIP.html

voilà certaines pages ont un décalage et je ne comprends pas, prenez essentiellement celles qui sont sur le bandeau vert, le site vient d'être créé.

Enfin bref voili voilou, si ça peut vous éclairer.

Et je vous donne mon CSS entier:

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
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
 
 
*{
	margin: 0;
	padding: 0;
}
 
img, fieldset, a img {
	border: none;
	margin: 0;
	padding: 0;
}
 
a {
	color: #666666;
	font-weight: bold;
	text-decoration: none;
}
 
a:hover {
	color: #ac2700;
	text-decoration: underline;
}
 
body {
	color: #666666;
	font: 12px Arial, Helvetica, sans-serif;
	background: url(images/pierre.jpg) repeat;
}
 
.clear {
	clear:both;
}
#bte2_1 h2{
font-family: Helvetica, sans-serif;;
	color: #2d7529;
	text-align: left;
	font-size: 18px;
	font-weight: normal;
	padding-bottom: 10px;
}
#bte2_1 h3{
font-family: Helvetica, sans-serif;;
	color: #2d7529;
	text-align: left;
	font-size: 15px;
	font-weight: normal;
	padding-bottom: 10px;
}
 
 
 
 
 
#global {
	width: 924px;
	margin: 0 auto;
	padding-top: 18px;
 
}
 
#banniere {
 
	width: 900px;
	height: 102px;
	background: url(images/#) no-repeat 0px 0px;
	}
 
 
 
#contenu {
	padding-top: 15px;
 
 
}
 
#bandeau{
	background:url(images/content_top.png) no-repeat 0px 0px;
	height: 12px;
}
 
#menu {
	background: url(images/.png) repeat-x;
	position: absolute;
	width: 100%;
	left: 0;
}
#menu ul {
	list-style: none;
	padding-left: 70px;
	display: block;
	width: 900px;
	margin: 0 auto;
}
 
#menu ul li {
	list-style: none;
	padding-left: 0px;
	display: inline;
}
 
#menu ul li a {
	text-decoration: none;
	display: block;
	float: left;
	color: #0a3d1b;
	font: 14px Arial, Helvetica, sans-serif;
	width: 15%;
	height: 56px;
	line-height: 56px;
	text-align: center;
 
}
 
#menu ul li a:hover {
	text-decoration: none;
	background: url(images/menu_hover.png) top center no-repeat;
}
#menu1 {margin-top:56px;
	background: url(images/menu_bg.png) repeat-x;
	position: absolute;
	width: 100%;
	left: 0;
}
#menu1 ul {
	list-style: none;
	padding-left: 0px;
	display: block;
	width: 900px;
	margin: 0 auto;
}
 
#menu1 ul li {
	list-style: none;
	padding-left: 0px;
	display: inline;
}
 
#menu1 ul li a {
	text-decoration: none;
	display: block;
	float: left;
	color: #ffffff;
	font: 10px Arial, Helvetica, sans-serif;
	width: 7%;
	height: 56px;
	line-height: 56px;
	text-align: center;
 
}
 
#menu1 ul li a:hover {
	text-decoration: none;
	background: url(images/menu_hover1.png) top center no-repeat;
}
 
 
 
#fond{
	background: #ffffff;
	padding: 54px 13px 0 13px;
 
}
 
#imagefixe {
	background: url(images/header_bg1.jpg) no-repeat top left;
	height: 241px;
}
 
#ombre {
	background: url(images/shadow.png);
	height: 41px;
}
 
#ombre1 {
	background: url(images/shadow1.jpg);
	height: 17px;
}
 
 
.bte-ombre {
	background: url(images/shadow2.png) no-repeat top left;
	padding: 20px 12px 0 12px;
 
}
#bte1{
width:900px;
height:auto;
 
}
ul#puces li {
		list-style: none;
		padding: 5px 0 3px 15px;
		background: url(images/bouton1.png) no-repeat left center;
	}
 
.marge {
margin-left: 1.4em;
}
 
#bte2{
	padding-top: 20px;
}
 
 
 
 
 
 
#bte2{margin-top:60px;
	padding-top: 13px;
	padding-bottom: 5px;
}
 
#bte2 h1{
	text-align: left;
	padding-left: 10px;
}
 
#bte2_1{
	float: left;
	padding-left: 10px;
	width: 900px;
}
#bte11{
	margin-top:-90px;
 
}
#bte112{
	margin-top:0px;
 
}
 
 
 
#basdepage {
	background:url(images/content_bot.png) no-repeat 0px 0px;
	height: 8px;
}
 
#ombre_basdepage{
	background: url(images/shadow3.png) no-repeat top left;
	height: 39px;
}
 
 
 
#bassite{
	text-align: center;
	padding: 20px;
}
 
#bassite p, #bassite a{
	color: #fff;
	font-weight: normal; 
}

Bon le code n'est pas si bien présenté mais je suis comme ça...si cela vous gène vraiment...je trierais bien tout!

Merci en tout cas pour votre aide!

serpolet · 01/09/2011, 23h27

C'est vraiment bizarre , même quand on va sur la page contact...ça fait ça...ainsi que sur la page presse lorsqu'on va sur le "+" pour ouvrir l'image..je vois vraiment pas pourquoi cela fait celà, peut être faudrait il que je recommence à zéro!:/

Kaamo · 02/09/2011, 11h17

Tu as ce fichier inclus dans certaines pages, pas dans d'autres. Il est d'ailleurs introuvable sur ton serveur ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<link href="page.css" rel="stylesheet" type="text/css" />

et pour le reste ... Wow, c'est le chantier là dedans

il y a des css définies dans le code, alors qu'elles devraient être dans les balises <head>. Pour trouver l'erreur, je pense que tu vas devoir ré-organiser ton code et mettre les éléments à leur bonne place.

Un ptit indice sinon : Dans le fichier contact, lorsque je supprime tout ce qu'il y a à l'intérieur de la <div> "bte2_1", la page se réaligne comme il faut.
Inspecte bien ce qu'il y a a l'intérieur de cette div et dans les autres pages aussi, tu devrais tomber sur ce qui provoque le décalage

serpolet · 02/09/2011, 12h58

J'ai testé de nouveau quelque chose pour la page "AZ" sans le mettre en ligne (sinon faut que je fasse les modifications pour toutes les pages).

En effet, j'ai enlevé tous les </br>...et adopter qu'une mise en page en css grâce notamment au padding-bottom qui est au final beaucoup plus efficace que </br>, le problème est toujours là...je ne comprends pas vraiment pas ce qui coince..

NoSmoking · 02/09/2011, 13h14

Bonjour,
ton problème est lié à l'apparition ou non de la scrollbar verticale, qui elle est liée à la hauteur de ton document.

serpolet · 02/09/2011, 13h55

Poualalalla Nosmoking...t'as été fort...toutes ces manipulations...pour ça!Merci beaucoup que je continuais à chercher!:/

Merci de ton aide!

à bientôt!

fab256 · 02/09/2011, 15h51

Tu pourrais donner une hauteur minimum a ta page comme ca tu as toujours le scroll.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
#fond {
background: white;
padding: 54px 13px 0 13px;
min-height: 500px;
}

serpolet · 02/09/2011, 17h39

Oui c'est ce que j'allais faire!

Merci beaucoup à tous et très bon forum d'entraide!

01/09/2011, 14h09	#2
Kaamo Membre éclairé Cyril Ingénieur développement logiciels Inscription : avril 2007 Messages : 205 Détails du profil Informations personnelles : Nom : Cyril Localisation : France, Nord (Nord Pas de Calais) Informations professionnelles : Activité : Ingénieur développement logiciels Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : avril 2007 Messages : 205 Points : 367 Points : 367	d'une page et d'une autre ? Car tel qu'il est posté là, le bloc global se met bien au milieu de la page, il n'y a pas l'air d'avoir un soucis quelconque. Peux-tu nous donner l'intégralité des deux pages ? Tout le code source de la première page Et tout le code source de la seconde (balises HTML incluses) Et il faut éviter de mettre les données perso (mail, téléphone etc )
	00

01/09/2011, 15h14	#4
fab256 Membre confirmé Développeur informatique Inscription : avril 2011 Messages : 196 Détails du profil Informations personnelles : Sexe : Localisation : Italie Informations professionnelles : Activité : Développeur informatique Secteur : Transports Informations forums : Inscription : avril 2011 Messages : 196 Points : 298 Points : 298	Le fichier CSS fourni n'est pas complet, il manque du texte au début! Les deux pages semble centré sans aucun décalage, peut être il faudrait nous donner l'adresse direct du site pour voir mieux.
	00

01/09/2011, 15h22	#5
serpolet Invité de passage Inscription : mai 2008 Messages : 37 Détails du profil Informations forums : Inscription : mai 2008 Messages : 37 Points : 3 Points : 3	D'accord je fais ça ce soir normalement, étant donné que c'est pas moi qui l'héberge, je ne peux l'héberger maintenant.. Merci pour toutes vos réponses en tout cas!
	00

01/09/2011, 23h27	#8
serpolet Invité de passage Inscription : mai 2008 Messages : 37 Détails du profil Informations forums : Inscription : mai 2008 Messages : 37 Points : 3 Points : 3	C'est vraiment bizarre , même quand on va sur la page contact...ça fait ça...ainsi que sur la page presse lorsqu'on va sur le "+" pour ouvrir l'image..je vois vraiment pas pourquoi cela fait celà, peut être faudrait il que je recommence à zéro!:/
	00

02/09/2011, 11h17	#9
Kaamo Membre éclairé Cyril Ingénieur développement logiciels Inscription : avril 2007 Messages : 205 Détails du profil Informations personnelles : Nom : Cyril Localisation : France, Nord (Nord Pas de Calais) Informations professionnelles : Activité : Ingénieur développement logiciels Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : avril 2007 Messages : 205 Points : 367 Points : 367	Tu as ce fichier inclus dans certaines pages, pas dans d'autres. Il est d'ailleurs introuvable sur ton serveur ? Code : Sélectionner tout - Visualiser dans une fenêtre à part <link href="page.css" rel="stylesheet" type="text/css" /> et pour le reste ... Wow, c'est le chantier là dedans il y a des css définies dans le code, alors qu'elles devraient être dans les balises <head>. Pour trouver l'erreur, je pense que tu vas devoir ré-organiser ton code et mettre les éléments à leur bonne place. Un ptit indice sinon : Dans le fichier contact, lorsque je supprime tout ce qu'il y a à l'intérieur de la <div> "bte2_1", la page se réaligne comme il faut. Inspecte bien ce qu'il y a a l'intérieur de cette div et dans les autres pages aussi, tu devrais tomber sur ce qui provoque le décalage
	00

02/09/2011, 12h58	#10
serpolet Invité de passage Inscription : mai 2008 Messages : 37 Détails du profil Informations forums : Inscription : mai 2008 Messages : 37 Points : 3 Points : 3	J'ai testé de nouveau quelque chose pour la page "AZ" sans le mettre en ligne (sinon faut que je fasse les modifications pour toutes les pages). En effet, j'ai enlevé tous les </br>...et adopter qu'une mise en page en css grâce notamment au padding-bottom qui est au final beaucoup plus efficace que </br>, le problème est toujours là...je ne comprends pas vraiment pas ce qui coince..
	00

02/09/2011, 13h14	#11
NoSmoking Modérateur Inscription : janvier 2011 Messages : 2 944 Détails du profil Informations personnelles : Sexe : Localisation : France, Isère (Rhône Alpes) Informations forums : Inscription : janvier 2011 Messages : 2 944 Points : 4 779 Points : 4 779	Bonjour, ton problème est lié à l'apparition ou non de la scrollbar verticale, qui elle est liée à la hauteur de ton document.
	00

02/09/2011, 13h55	#12
serpolet Invité de passage Inscription : mai 2008 Messages : 37 Détails du profil Informations forums : Inscription : mai 2008 Messages : 37 Points : 3 Points : 3	Poualalalla Nosmoking...t'as été fort...toutes ces manipulations...pour ça!Merci beaucoup que je continuais à chercher!:/ Merci de ton aide! à bientôt!
	00

02/09/2011, 17h39	#14
serpolet Invité de passage Inscription : mai 2008 Messages : 37 Détails du profil Informations forums : Inscription : mai 2008 Messages : 37 Points : 3 Points : 3	Oui c'est ce que j'allais faire! Merci beaucoup à tous et très bon forum d'entraide!
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email