Décalage site html lors du zoom

**alexoman63** · 29/06/2011, 19h55

salut a tous

J'ai un souci, je commence a créer un site en html et j'ai un bug quand je zoom avec le navigateur le site se décale, que faire ?

Voici mon code

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
<html><fr>
 
<head>
 
 
<title>index</title>
 
 
</head>
 
<center>
 
<body>
 
<!-- }PAGE CENTRAL DU SITE{ -->
 
	<div style="width:1024;height:1214;solid black;background:black;top:1;">
 
	<div style="width:1024;height:150;solid black;">
 
	<a href="./Acceuil.html"><img src="./baniere.jpg"/></a>
 
	</div>
 
	<div style="width:1024;height:40;position:absolute;top:150;">
 
	<font href="./acceuil1.html"><marquee><img src="./defilement baniere.jpg"/></marquee></font>
 
		</div>
 
	<div style="width:1024;height:30;border:1px solid white;position:absolute;top:190;">
 
	<a href="./Acceuil.html"><img src="./acceuil.jpg"/></a>
 
	<a href="./Photos.html"><img src="./photos.jpg"/></a>
 
	<a href="./Videos.html"><img src="./videos.jpg"/></a>
 
	<a href="./Agenda.html"><img src="./Agenda.jpg"/></a>
 
	<a href="./Liens.html"><img src="./liens.jpg"/></a>
 
	<a href="./Partenaires.html"><img src="./partenaires.jpg"/></a>
 
	<a href="./Membres.html"><img src="./membres.jpg"/></a>
 
	<a href="./Contact.html"><img src="./contact.jpg"/></a>
 
	<a href="./Benevoles.html"><img src="./benevoles.jpg"/></a>
 
	<a href="http://graffartrisforum.com"target="_blank"><img src="./forum.jpg"/></a>
 
		</div>
 
		<div style="width:1024;solid white;position:absolute;top:200;" align="center"></br>
 
	<p><b><font size="5" color="red"><blink>LE PROJET SUR TOILE EST LA.</blink></font>
 
	<p><font color="white">CLIQUEZ DESSUS</font>
 
	<a href="Photos.html"></br><img src="./ruben5.jpg" width="300" height="200"/></a>
 
	</br>
	</br>
 
	<p><font color="white">Salut a tous,
 
	<br/>et bienvenu sur le nouveau site de la troupe <blink><font color="red"><b>GRAFFARTRIS</b></font></blink>
 
	</p>Nous somme heureux de vous comptez parmis nous,<br/>a votre disposition des<a href="./videos.html" class="type2">Videos</a>,<a href="./photos.html" class="type2">Photos</a> et d'autres bonus vous seront presentez.</font>
 
		</div>	
 
		<div style="width:700;solid white;position:absolute;top:700;left:690;"></br>
 
		<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_facebook_like""button_count"></a>
<a class="addthis_button_tweet"> </a>
<a class="addthis_counter addthis_pill_style"> </a>
 
		</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4deeb6c83dd78f34"></script>
 
		</div>
 
		</div>
 
<!-- 	PAGE DE GAUCHE    -->	
 
		<div style="width:250;height:1000;border:1px solid white;position:absolute;background:black;top:220;left:67">
 
	<!-- Champ de recherche Google -->
<form method=GET action="http://www.google.fr/search">
		<table bgcolor="#FFFFFF"><tr><td>
	<a href="http://www.google.fr">
		<img src="http://www.google.com/logos/Logo_40wht.gif" border="0"alt="Google" align="absmiddle"></A>
			<input type=text name=q size=26 maxlength=255 value="">
			<input type=hidden name=hl value=fr>
			<input type=submit name=btnG VALUE="Recherche Google"></td></tr>
		</table>
</form>
<!-- Google -->
 
&nbsp;
 
	<a href="./Acceuil.html"><img src="./acceuil bis.jpg"/></a>&nbsp;</br>
 
	<a href="./Photos.html"><img src="./photos bis.jpg"/></a>&nbsp;</br>
 
	<a href="./Videos.html"><img src="./videos bis.jpg"/></a>&nbsp;</br>
 
	<a href="./Agenda.html"><img src="./Agenda bis.jpg"/></a>&nbsp;</br>
 
	<a href="./Liens.html"><img src="./liens bis.jpg"/></a>&nbsp;</br>
 
	<a href="./Partenaires.html"><img src="./partenaires bis.jpg"/></a>&nbsp;</br>
 
	<a href="./Membres.html"><img src="./membres bis.jpg"/></a>&nbsp;</br>
 
	<a href="./Contact.html"><img src="./contact bis.jpg"/></a>&nbsp;</br>
 
	<a href="./Benevoles.html"><img src="./benevoles bis.jpg"/></a>&nbsp;</br>
 
	<a href="http://graffartrisforum.com"target="_blank"><img src="./forum bis.jpg"/></a>&nbsp;</br>
 
	</br><!-- [ShootBox Code v.1.0 Iframe] --><iframe src="http://chat.shootbox.fr/?idshootbox=28147" frameborder="0" allowtransparency="true" scrolling="no" height="410" width="195">Webmaster, installe aussi une Shootbox gratuite (shoutbox gratuit ou mini-chat) sur ton site, ton blog ou ton forum ! Pas besoin de connaitre le html pour creer ou inserer le code de la shoutbox. ShootBox.fr</iframe>
		<!-- Lien OBLIGATOIRE --><div id="shootbox"><a title="Shoutbox gratuite" href="http://www.shootbox.fr/" onclick="window.open(this.href,'_blank');return false" style="font-size:9px;text-decoration:none">&copy; Shoutbox gratuite </a>
		</div><!-- [/ShootBox Code Iframe] -->
 
 
	</div>
 
	<!-- PAGE DE DROITE -->
 
	<div style="width:250;height:1000;border:1px solid white;position:absolute;background:black;top:220;left:1345">
 
	</br>
 
	<p><script src="http://connect.facebook.net/en_US/all.js#xfbml=1">
 
			</script><fb:like-box href="http://www.facebook.com/pages/Ris-France/Graff-Art-Ris/149605845082287" width="200" height="700" show_faces="true" stream="true" header="true"></fb:like-box></p>
		&nbsp;
		<a href="http://www.000webhost.com/" target="_blank"><img src="http://www.000webhost.com/images/120x60_powered.gif" alt="Web Hosting" width="120" height="60" border="0" /></a>
 
	</div>
 
</body>
 
</html>

Merci d'avance

**12monkeys** · 29/06/2011, 20h22

Bonjour

Commencer par apprendre les bases : http://j-willette.developpez.com/tut...bases-du-html/

Il n'y a pas de DOCTYPE http://xhtml.developpez.com/faq/?pag...octype_utilite

C'est quoi cette balise <fr> tout de suite après <html> ?

Une balise <center> en dehors de <body>

Tu utilises du CSS :

Code css :

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

<div style="width:1024;height:1214;solid black;background:black;top:1;">

Tout ce qui est dans le style est du CSS, enfin y ressemble : en css spécifier une valeur est obligatoire, ainsi : width:1024pxet puis solid black ne correspond à rien, ce sont des valeurs mais il manque la propriété avant, etc...

Corrige tes erreurs avec le validateur de code : http://validator.w3.org/check
Tu as actuellement 65 erreurs et 30 warnings.

Enfin pour faire de la mise en page avec CSS je te conseille : http://pbnaigeon.developpez.com/tuto...e-en-page-CSS/

Décalage site html lors du zoom

HTML

Vue hybride

Discussions similaires

Partager

Partager