menu css, probleme ie8 / ff3 : lien non cliquables
Bonjour à tous,
J'utilise un menu css assez basique sur mon site internet qui fonctionne bien sur une grande partie des navigateurs. (script expliqué par normandlamoureux)
Mais voila, sous Safari (derniere version?), sous ff3 et surtout ie8, les liens ne sont pas cliquables. le rollover ne fonctionne pas, bref le menu n'est pas fonctionnel.
Avez vous connaissance de problemes similaires ? que puis je faire pour débugger ?
Je suis dessus depuis ce matin, impossible de trouver la solution.
Merci d'avance.
Je met le code html et css ci dessous pour aperçu:
html :
Code:
1
2
3
4
5
6
7
8
| <div id="en-tete">
<ul>
<li><a href="index.html"><span>Accueil</span></a></li>
<li><a href="devis.html"><span>Demande en ligne</span></a></li>
<li><a href="informations.html"><span>Informations</span></a></li>
<li><a href="contact.html"><span>Contact</span></a></li>
</ul>
</div> |
css:
Code:
1
2
3
4
5
6
7
8
9
10
| #en-tete ul {margin:16px 16px 0 0; padding:0; list-style:none}
#en-tete li {float:left; margin-left: 3px}
#en-tete a, #actif {float:left; text-decoration:none; letter-spacing:1px; padding-
left:10px; background:url(coin-gauche.png) 0% -250px no-repeat}
#en-tete span, #actif span {float:left; padding:6px 10px 3px 0; background:url(coin-
droit.png) 100% -250px no-repeat; color:#fff; font-weight:bold;}
#actif {background-position:0 0}
#actif span {background-position:100% 0; color:#333}
#en-tete a:hover, #en-tete a:focus {background-position:0 -500px}
#en-tete a:hover span, #en-tete a:focus span {background-position:100% -500px} |
