Discussion :

[gomodo]

Bonjour à tous.
Mon problème de centrage horizontal semble bateau.. mais je n'y arrive pas.

Voila le résultat que j'attend, mais que je n'obtiens que dans IE :



En vert : le div que je vais placer ou je veux dans la page.
En violet : le sous-div "vignette" sur lequel je fais un effet sur un mouseover (javascript).
En rouge : le tableau qui contient l'image (tableau pour le centrage vertical)

Mais sous Firefox j'obtiens ceci :



Voici le code correspondant (head et body)

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
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
body {
	background-color: #DFDFFF;
}
#cadre_contenant_vignette{
	position:absolute;
	z-index:1;
	left: 565px;
	top: 138px;
	visibility: visible;
	overflow: hidden;
	width: 207px;
	background-repeat: no-repeat;
	background-color: #00CC33;
	margin-left: 0px;
	margin-right: 0px;
	text-align: center;
	}
-->
</style>
<script type='text/javascript'>
function VignetteOver (id) {
		//changeBgImage('/templates/menu/images/vignetteBGHover.png', id);
}
 
function VignetteOut (id) {
		//deleteBgImage(id);
}
</script>
</head>
<body >
<div id="cadre_contenant_vignette" > <!--vignette -->
 <div 
	id="vignette41"
 
	style="
	width:112px;
	border: none;
	background-color:#61306B;
	cursor: pointer; 
	margin-left: 0px;
	margin-right: 0px;
	text-align: center;
	"
 
	onmouseover="VignetteOver('vignette41');"
	onmouseout="VignetteOut('vignette41');"
  >
	  <table height="82" align="center" cellspacing="0" bgcolor="#CC3333">
		<tr>
			<td align="center" valign="middle">
			<img src='http://www.developpez.net/forums/images/logo16.gif' width="80" height="38" />			</td>
		</tr>
	  </table>
  </div><!--fin vignette-->
</div>
</body>

Ou est mon erreur ?

Merci aux esprits éclairés.

[devyan]

Salut,

Essaye de remplacer

Code :

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

1
2
margin-left:0;
margin-right:0;

par

Code :

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

1
2
margin-left:auto;
margin-right:auto;

dans le CSS de #vignette41

[gomodo]

Merci beaucoup devyan.