Discussion :

[lolymeupy]

Bonjour,
j'ai un problème d'affichage d'un menu entre Mozilla et IE, et je ne sais pas du tout pourquoi.

Voici 1 lien pour tester sous Mozilla et IE :
http://www.oditeohr.com/baby/

Et voici le code :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<div id="GA01">
<a href="index.html" title=""><img src="titreaccueil01.gif" style="border:none;width:175px;padding-bottom:3px;" onmouseover="this.src='titreaccueil02.gif'" onmouseout="this.src='titreaccueil01.gif'" alt="accueil" title=""/></a>
<a href="histoirebaby.html" title=""><img src="titrehistoire1.gif" style="border:none;width:175px;height:28px;" onmouseover="this.src='titrehistoire2.gif'" onmouseout="this.src='titrehistoire1.gif'" alt="histoire" title=""/></a>
<a href="regles.html" title=""><img src="titreregledejeu1.gif" style="border:none;width:175px;height:28px;" onmouseover="this.src='titreregledejeu2.gif'" onmouseout="this.src='titreregledejeu1.gif'" alt="regle de jeu" title=""/></a>
<a href="comprendrebaby.html" title=""><img src="titremateriel1.gif" style="border:none;width:175px;height:28px;" onmouseover="this.src='titremateriel2.gif'" onmouseout="this.src='titremateriel1.gif'" alt="materiel" title=""/></a>
<a href="lexique.html" title=""><img src="titrelexique1.gif" style="border:none;width:175px;height:28px;" onmouseover="this.src='titrelexique2.gif'" onmouseout="this.src='titrelexique1.gif'" alt="lexique" title=""/></a>
<a href="insolite.html" title=""><img src="titreinsolite1.gif" style="border:none;width:175px;height:28px;" onmouseover="this.src='titreinsolite2.gif'" onmouseout="this.src='titreinsolite1.gif'" alt="insolite" title=""/></a>
<a href="niveau.html" title=""><img src="titrevotreniveau1.gif" style="border:none;width:175px;padding-bottom:3px;height:28px;" onmouseover="this.src='titrevotreniveau2.gif'" onmouseout="this.src='titrevotreniveau1.gif'" alt="niveau" title=""/></a>
<a href="http://www.supreme.fr/acatalog/" title=""><img src="titreventeenligne1.gif" style="border:none;width:175px;height:28px;padding-bottom:3px;" onmouseover="this.src='titreventeenligne2.gif'" onmouseout="this.src='titreventeenligne1.gif'" alt="vente en ligne" title=""/></a>
</div>

Merci d'avance

en fait le probleme vient des padding je pense, mais si je les enlève, sur mozilla ça va planter aussi....!!!

[Erwan31]

Bonjour,
c'est IE qui transforme certains espaces non significatif au niveau des éléments
inline (retour a la ligne et espaces) dans le code en espace supplémentaire à l'affichage.

Une solution:

Code :

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

#GA01 img {display:block;}

[lolymeupy]

Merci beaucoup Erwan31

Effectivement ça fait tout de suite moins "crade"...

Par contre y'a toujours un petit decalage entre "vente en ligne" et "recherche" . Est-ce que tu sais d'où il vient ce décalage ?

[lolymeupy]

Je viens de trouver d'où vient le décalage.
Il faut juste enlever le

Code :

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

padding-bottom:3px;

qui est au niveau de "Vente en ligne"...

Merci encore Erwan31