Bonjour,
j'ai essayé des top:50% et des valign:middle mais j'arrive toujours pas a centrer mon image, voici le code :
HTLM :
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 <html> <head> <link rel="stylesheet" type="text/css" href="./style.css" media="all" /> <script language="javascript"src="./bouge_map.js"></script> </head> <body onLoad=cacher();> <div align="center"> <div id="map" style="border:3px solid #000000;overflow:hidden"> <table width="100%" border="0px"> <a id="armoire1" href="../robots/alsace_strasbourg.htm" target="droite"></a> <img src="./image.jpg" alt="carte"/> </table> </div> <tr> <td><div id="div_gauche" onmouseover="active('G')" onmouseout="desactive()"</div></td> <td align="right"><div id="div_droit" onmouseover="active('D')" onmouseout="desactive()"></div></td> </tr> </div> </body> </html>
Ce qui donne :
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 div#map { background-image: url(./bg.gif); height: 100%; width: 400px; } div#div_gauche { background-image: url(./fleche_g.gif); left: 0px; } div#div_droit { background-image: url(./fleche_d.gif); right: 0px; } #div_droit, #div_gauche { background-repeat: no-repeat; position: absolute; height: 52px; width:52px; top: 50%; } #armoire1 { background-image: url(./armoire.gif); left: 69px; top: 197px; background-repeat: no-repeat; position: relative; display: block; height: 23px; width: 23px; }
Auriez vous une solution?
Partager