Problème de comptabilité entre Mozilla et IE

Bonjour,

Cela fait un moment que je navigue sur votre site, il est super et très bien expliqué.

J'ai créé un menu horizontale en CSS, avec Mozilla, c'est nickel mais avec IE6 ou 7, mes boutons n'ont pas la bonne taille.
Je n'arrive pas à comprendre d'où vient le problème ??

Voici mon code CSS :

#foxmenucontainer {
height:24px;
background:#000;
display:block;
padding:2px 0 2px 0;
}

#foxmenu {
position:relative;
display:block;
height:24px;
font-size:11px;
font-weight:bold;
font-family:Arial,Verdana,Helvitica,sans-serif;
}

#foxmenu ul {
margin:0px;
padding:0;
list-style-type:none;
width:auto;
}

#foxmenu ul li {
display:block;
float:left;
margin:0 1px 0 0;
vertical-align:middle;
}

#foxmenu ul li a {
display:block;
float:left;
color:#fff;
text-decoration:none;
padding:5px 20px 0 20px;
height:19px;
background:transparent url(http://www.jjb-france.com/Images/Page_accueil/foxmenu_bg-OFF.gif) no-repeat top left;
}

#foxmenu ul li a:hover {
color:#fff;
background:transparent url(http://www.jjb-france.com/Images/Page_accueil/foxmenu_bg-OVER.gif) no-repeat top right;
}

#foxmenu ul li a.current,#foxmenu ul li a.current:hover {
color:#000;
background:#fff;
}

Voici mon code HTML :

<div id="foxmenucontainer">
<div id="foxmenu">
<ul>
<li><a href="http://www.jjb-france.com/index.php">Page Accueil</a></li>
<li><a href="http://www.jjb-france.com/BD_Fighters/affiche_news.php">Les News</a></li>
<li><a href="http://www.jjb-france.com/BD_Fighters/affiche_accueil_resultat.php">Les Résultats MMA</a></li>
<li><a href="http://www.jjb-france.com/BD_Fighters/accueil_k1.php">Tout sur le K-1</a></li>
<li><a href="http://www.jjb-france.com/BD_Fighters/affiche_lien.php">Les Liens</a></li>
<li><a href="http://www.jjb-france.com/BD_Fighters/affiche_videos.php">Les Vid&eacute;os MMA</a></li>
<li><a href="http://www.jjb-france.com/BD_Fighters/identification.php">Partie Admin</a></li>
<li><a href="#">Date : <? echo date_fr(); ?></a></li>
</ul>
</div>
</div>

Voici l'adresse de mon site : http://www.jjb-france.com/index2.php

J'attend l'avis d'experts en la matière et j'espère que mon problème sera résolu !

Merci d'avance.

Nicolas

Bonjour Nicolas et bienvenu en tant que membre actif

Je viens de tester le code fourni et chez moi, en local tout se passe bien.
Ceci dit, pour essayer de corriger ton problème, je te conseillerais de remplacer le height par un line-height sur tes liens.

D'autre part, le div #foxmenu englobant ta liste est inutile : pourquoi ne pas donner cet identifiant directement à la liste ?
Modifié par Cygnus (26 Feb 2008 - 18:18)

Merci beaucoup

Désormais j'ai mes boutons à la bonne hauteur sur IE et Mozilla.

Là je cherche à remonter un peu mon texte pour que celui ci soit centré verticalement dans le bouton.......

Une idée du bout de code à changer ???

Merci d'avance

Cygnus a écrit :


D'autre part, le div #foxmenu englobant ta liste est inutile : pourquoi ne pas donner cet identifiant directement à la liste ?

Que veux tu dire par là ?

Sinon j'aimerais savoir comment remonter le texte de quelque millimètre car là je n'y arrive pas ??

lebanner a écrit :
Que veux tu dire par là ?

Qu'il ne sert à rien ici de faire ceci:

<div id="foxmenu">
<ul>
...
</ul>
</div>

Tu pourrais directement agir sur le conteneur de ta liste:

<ul id="foxmenu">
...
</ul>

lebanner a écrit :
remonter le texte de quelque millimètre

En web, on parle généralement en pixels…