[RESOLU]Menu realisé en ul (avec des png) n'apparait pas dans ie8

Bonjour,

Avez-vous une idée pour le fait que les images de mon menu n'apparaissent pas dans ie8 mais bien dans FF ?

voici mon html

<div id="menu">             
<ul>                 
<li><a href="http://www.set-up/index.html" class="bt1 Style2">ACCUEIL</a></li>
<li><a href="http://www.set-up/setup_services.html" class="bt2">SERVICES</a></li>
<li><a href="http://www.set-up/setup_partenaires.html" class="bt3">PARTENAIRES</a></li>
<li><a href="http://www.set-up/setup_references.html" class="bt4">REFERENCES</a></li>
<li><a href="http://www.set-up/setup_contact.html" class="bt5">CONTACT</a></li>
</ul>
</div>

voici mon css au cas ou

#menu{
margin:0px; padding:0
}

#menu ul li{
list-style:none; float:left; padding:0;
}

#menu ul li a{
display:block; text-decoration:none; text-align:center; font-size:14px; color:#333333; line-height:47px;
}

#menu ul li a.bt1{
height:74px; width:100px; background:url(img/bt1.png)no-repeat top left;
}  

#menu ul li a.bt2{
height:74px; width:104px; background:url(img/bt2.png)no-repeat top left;
}  

#menu ul li a.bt3{
height:74px; width:135px; background:url(img/bt3.png)no-repeat top left;
}  

#menu ul li a.bt4{
height:74px; width:131px; background:url(img/bt4.png)no-repeat top left;
}  

#menu ul li a.bt5{
height:74px; width:127px; background:url(img/bt5.png)no-repeat top left;
}

#menu ul li a:hover{
background-position:bottom left;
}

Bien à vous.
Modifié par michelmaguin (27 Oct 2010 - 19:17)

Salutation michelmaguin

Ton lien est manqué : regarde sur ta barre d'état.
Aussi je ne comprend pas ton premier <li><a href="http://www.set-up/index.html" class="bt1 Style 2">...</a></li>

Puisses-tu vérifier ces points avant toutes choses : sais-t-on jamais ?

++
Modifié par zardoz (13 Oct 2010 - 12:28)

Bonjour,
je ne vois pas dans quel barre d'état mon lien est manqué,
et pour "bt# style2" c'est juste le nom de mon image.

pourtant tout fonctionne dans FF...

une soluce?

Salut

Je parle du lien vers ton site : valeur null.
Sur la barre d'état : ~http://forum.alsacreations.com/null.

Pour ce qui est de ta balise <li><a>...</a></li> le nom de la classe est bien bt1
Je ne crois pas que ça soit logique de marquer Style 2 : ne serais-ce que pour la sémantique.

Au minimum arrange nous le lien vers ton site qu'on puisses voir les fichiers : merci.

++
Modifié par zardoz (13 Oct 2010 - 12:38)

Bonjour,

Il suffit d'ajouter un espace pour que IE soit satisfait :

/* Avant */
background:url(img/bt1.png)no-repeat
/* Après */
background:url(img/bt1.png) no-repeat

Bonjour,
Merci pour les réponses,

je suis ultra novice, donc je pense comprendre que la valeur null de mon lien voudrais dire qu'il va sur rien (I suppose ), mais si c'est ça, ce n'est pas grave car mon site n'as pas encore de nom de domaine.

Et pour que le nom de mon image: les boutons sont tous nommés bt#.png sauf un qui porte un nom différent et cela peut causer un problème d'affichage pour celui-ci.

Mais Pq tout est ok dan Firefox(FF)pour l'affichage du menu et surtout quand on passe la souris dessus?

Désoler d'être un peu lourd
je m'en rend bien compte...

Bien à vous.
Modifié par michelmaguin (27 Oct 2010 - 19:18)

Bonjour,

michelmaguin a écrit :
Mais Pq tout est ok dan Firefox(FF)pour l'affichage du menu et surtout quand on passe la souris dessus?

Car, comme te l'a fait remarqué Julien, il manque un espace avant no-repeat.

Ps. : Merci d'éviter le language SMS, le forum se veux accessible, même aux personnes dont le langue principale n'est pas le français (et à plein d'autres).

Merci Mr royer ,
je vais tester cela tout à l'heure.

Allo

michelmaguin a écrit :

je suis ultra novice, donc je pense comprendre que la valeur null de mon lien voudrais dire qu'il va sur rien (I suppose ), mais si c'est ça, ce n'est pas grave car mon site n'as pas encore de nom de domaine.

Et pour que le nom de mon image: les boutons sont tous nommés bt#.png sauf un qui porte un nom différent et cela peut causer un problème d'affichage pour celui-ci.

Pour l'url du site ?

En fait pour la plupart d'entre nous ça cause pas vraiment de problème. Mais pour la communauté oui le problème se confirmait.

Pour ce qui est de l'image ?

Eh bien comme mentionné plus haut il s'agissait plutôt du nom de la classe : class="bt1 Style 2" déclarer dans la balise <a> Tandis que ton CSS le défini comme étant bt1, bt2, bt3, bt4 et bt5.

Je n'ai pas encore visualisé tes scripts CSS m'enfin : certaines recommandations t'auront quand même été suggérer ici en haut : le fameux espace entre l'instruction background et le no-repeat. Que je n'avais pas vu d'ailleurs.

Reste à savoir si c'est IE ou FF qui néglige .
IE étant le seul qui respecte la convention d'écriture à ce que je vois

Tiens nous au courant du bon fonctionnement s.v.p.

++
Modifié par zardoz (13 Oct 2010 - 18:31)

Wow , voilà effectivement l'espace avant "no repeat" a été salutaire.
Merci Julien Royer!

J'ai aussi modifié les autres erreurs Merci Zardoz .

Bien à vous.
Modifié par michelmaguin (27 Oct 2010 - 19:18)