Bonjour,

j'ai essayé des top:50% et des valign:middle mais j'arrive toujours pas a centrer mon image, voici le code :

HTLM :
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>
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
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;
}
Ce qui donne :


Auriez vous une solution?