[résolu] Hover sur background : différences selon les navigateur

Auteur
Gargamel	# 03 Sep 2010 - 17:44:32
16 Posts	Bonjour, Je rencontre actuellement des différences d'interprétation sur un hover que j'applique sur un background. En l'occurence sur le div #telephone. C'est correctement aligné sous IE et Opéra, mais décalé d'un pixel sous FireFox. Quant à Chrome, le hover ne s'applique pas du tout. Mon css : `html { font-size:100%; } body { margin:10px 0; padding:0; background: #464646; } #content { margin:auto; background: #262626 url(images/resiliation_home.png) no-repeat center center; width:1073px; } html>body #content{height:auto; min-height:700px} #telephone { float:left; width:50%; height:235px; } #telephone:hover { background: url(images/haut_gauche2.png) no-repeat 334px 61px; }` Le html `<body> <div id="content"> <div id="telephone"> </div> <div id="television"> </div> ... </div>` Le tout est concrètement visible ici : http://www.resiliation.com/V2/ J'ai essayé de chercher du côté des fusions des marges ou bien encore essayé d'appliquer un padding: 1px 0; Une idée ? Merci d'avance Modifié par Gargamel (03 Sep 2010 - 19:32)
16 Posts
Heyoan	# 03 Sep 2010 - 18:13:20
Modérateur 8101 Posts	Salut, il y aura toujours des mini-décalages d'un navigateur à l'autre à partir du moment où ils doivent effectuer un calcul arrondi. C'est le cas lorsque tu indique center center dans le background. Donc en remplaçant `background: #262626 url(images/resiliation_home.png) no-repeat center center;` par `background: #262626 url(images/resiliation_home.png) no-repeat 195px 39px;` ça devrait passer puisque le background et le hover auront la même référence (haut / gauche). Éléments html, hiérarchie XHTML 1.0 Strict et propriétés CSS
Modérateur 8101 Posts
Gargamel	# 03 Sep 2010 - 18:25:09
16 Posts	J'avais bien conscience du problème de l'arrondi. Ta soluce marche niquel, je t'en remercie ; il n y a plus de décalage IE/FF/OP. En revanche ça ne s'affiche pas du tout sur Chrome, j'imagine que là on peut rien faire ... en attendant un éventuelle énième mise à jour non ? a+
16 Posts
Heyoan	# 03 Sep 2010 - 18:45:08
Modérateur 8101 Posts	Gargamel a écrit : En revanche ça ne s'affiche pas du tout sur Chrome Ben comme je l'avais supprimé je l''ai réinstallé à partir du download disponible (en tout cas aujourd'hui) sur http://www.google.fr/ et je n'ai pas eu de problème. Éléments html, hiérarchie XHTML 1.0 Strict et propriétés CSS
Modérateur 8101 Posts
Gargamel	# 03 Sep 2010 - 19:01:27
16 Posts	Oops, en vidant le cache tout remarchait pour chrome ..... Par contre j'ai appliqué la même chose pour le logo TV (haut à droite), et j'ai re un décalage mais cette fois, il n'y a que ie8 qui se décale... foutu virgule Un <!-- IF spécial ie devrait le corriger ..
16 Posts