[Résolu] Liens non reconnus par IE7 lorsqu'on arrive dessus par le ba

Bonjour,

Aujourd'hui, j'ai montré à une connaissance comment implémenter différemment un menu. J'ai utilisé des sprites CSS (en lieu et place de moult images et de Javascript dans l'implémentation d'origine).

Voici le menu en question : http://dl.dropbox.com/u/1550266/Argorate/menu.html

Tout cela fonctionne très bien sur les navigateurs Webkit et Gecko, et même sur IE8. En revanche, sur IE7… Les 3 liens les plus haut ne sont pas toujours reconnus… A moins de les attaquer par le haut, et encore…

Quelqu'un aurait une explication (et éventuellement une solution) à propos de ce comportement ? Je dois avouer que je ne comprends pas ce qui peut causer ça.

En beaucoup moins problématique vis à vis d'IE, je note de petites différences (par rapport à la version de la page lue par Webkit) d'un ou deux pixel lors des survols. Quelles en sont les causes ? La feuille de style spéciale IE est-elle l'unique solution ?

Je vous remercie d'avance et vous souhaite une bonne journée !


Sephi-Chan
Modifié par Sephi-Chan (27 Sep 2010 - 20:47)

bonjour,

par defaut li
- est en display:block;(enfin , list-item)
- mesure 1em a 1.2em de hauteur dans les IE un peu agé ...

Du coup ,

tu as 6 li , les unes sur les autres dans IE7 et moins qui se superpose aux autre contenus (hauteur d'environ 6em a 7.2em )

soluce : met tes li en float ou display:inline , pour qu'elle se retracte sur elle mêmes sans se superposé au liens extraits du flux et repositionné dans la zone a celle qu'elles occupent .

z-index pour a ne devrait te servir a rien , car li est ici son referent .


par exemple :

#menu li {
float:left; /* ou right */
display:inline; /* vire assurement la puce qui perdure dans certains navigateur + 1 defaut ie6  */
}

GC

Hello,

Merci beaucoup pour cette réponse et la solution apportée. Toutefois, elle soulève une question : quand j'affichais des bordures pour mes liens (et non les éléments de la liste), leur emplacements semblaient correspondre à ce que je voulais et pourtant, ils ne réagissaient pas au survol, pourquoi cette incohérence (ils étaient là sans vraiment l'être) ?


En tout cas, merci pour l'explication concernant les vieux IE !



Sephi-Chan

Sephi-Chan a écrit :
Hello,

Merci beaucoup pour cette réponse et la solution apportée. Toutefois, elle soulève une question : quand j'affichais des bordures pour mes liens (et non les éléments de la liste), leur emplacements semblaient correspondre à ce que je voulais et pourtant, ils ne réagissaient pas au survol, pourquoi cette incohérence (ils étaient là sans vraiment l'être) ?


En tout cas, merci pour l'explication concernant les vieux IE !



Sephi-Chan

Bonsoir

comme dit precedement , tes li (transparente) se trouvaient au dessus , du coup les liens ne pouvaitent reagir au passage de la souris survolant les item de liste vide (<a> retiré du flux avec le positionement en absolu ... IE vielles versions , il y avait opera qui traitait l'affichage de la même façon me semble t-il , ça vaut peut-etre un test ? )

++

Okay impeccable, je pensais à tort que les liens serait tout de même considérés comme "au dessus", grâce au positionnement absolu.

J'ai testé ça sur Opéra (10.62, le tout sous Mac OS X en 10.4) et le fonctionnement est similaire à celui de Webkit et Gecko, même sans faire flotter (ou mettre en ligne) l'élément de liste.

En tout cas, merci pour ces précisions sur le fonctionnement de la chose !


Sephi-Chan