Sous-menu déroulant qui passe sous le contenu dans IE

Bonjour,

J'appelle au secours car ça fait plusieurs jours que j'essaie de résoudre ce problème, malgré mes recherches sur les forums :
http://www.sudprofil.com
Sur IE, quand je survole le menu horizontal, le sous-menu se déroule au survol de l'item "Nos Produits". Si je parcours ce sous-menu, il cesse de s'afficher au sous-item "Salades".
J'ai essayé de manipuler les attributs z-index, overflow, position... sans aucun résultat. Ce problème se présente avec IE7 et IE8, mais pas sur Firefox, ni sur Chrome, ni sur Safari.

Quelqu'un a-t-il une idée pour résoudre ce problème, SVP ? (je peux envoyer le fichier CSS par mail ou message privé).
Merci à l'avance pour vos réponses.
Modifié par marie12 (15 Dec 2010 - 11:21)

Salut,

Ca vient du fait qu'il y a un espace entre chacun de tes li. En passant entre les li, IE considère que tu es hors du sous-menu étant donné qu'il "voit" en-dessous (ou plus exactement, puisque ton curseur a pointé sur le texte qui est dessous).

Une solution serait par exemple de mettre une couleur de fond à ton ul pour ne pas laisser apparaitre ce qui est sous le sous-menu.

bonjour,

<edit> Grillé, le temps de boire un café , et hop une reponse se glisse dans le topic , du coup je repete ce que te dis agylus, désolé</>

ton ul de sous-menu n'ayant pas de fond ou transparent et tes li a quelques pixels les unes des autres, fait qu'au survol du menu , entre les trous, ce qui est survolé dans IE , n'est plus le menu mais la page.

Soluces au choix :
- donner un fond opaque a ul
- mettre a zero height de li
-creer une ombre qui va remplir ce trou sous les a de tes li avec un filtre special IE , si tu tient a conserver l'aspect actuel au plus proche. ex: ul.menu ul li a{filter :
progid:DXImageTransform.Microsoft.DropShadow(offx=0, offy=3, color= #F3F3F3 );
}

GC
Modifié par gc-nomade (15 Dec 2010 - 12:56)

Merci pour ta réponse rapide, Agylus. J'ai corrigé le problème pour l'instant en mettant une couleur en background pour le sous-menu.
Merci aussi pour ton intervention, GC, je vais tester tes solutions. Je ne connaissais pas cette propriété "filter...", qui n'existe pas dans mon bouquin de CSS... Merci pour ta technicité. Je reviens sur ce forum si ça ne marche pas.
Modifié par marie12 (15 Dec 2010 - 13:38)

oups, une betise pour les li, ne pas mettre height a zero mais enlever le height tout simplement


Explication pour le choix du filtre dans ce cas:
Pour le filtre ce n'est pas son utilité première bien entendu, mais comme cela ne passera que dans IE .En comblant ce trou, cela devrait convenir sans perturbé les autres.

Une couleur de fond f3f3f3 a li se suffirait aussi , quand a la semi bordure basse simulé avec le filtre une simple vrai bordure css basse aurait pu faire l'affaire ... sauf que certaines version de IE peuvent bugger dessus si il y a un defaut de haslayout, plutôt à eviter du coup.

OK pour la solution avec le filtre pour Windows : cela donne un résultat un peu équivalent à un background de couleur sous le sous-menu.
Est-il possible d'obtenir une ombre dégradée, comme dans l'exemple montré au bas de cette page ?
http://www.scriptfx.com/transitions/shadow/shadow.htm
Je n'ai pas réussi à l'obtenir...

plutot avec shadow alors , et une couleur plus foncé par exemple:

filter : progid:DXImageTransform.Microsoft.Shadow(Color=#999999, Direction=180);

Bonjour, GC,

Bon, c'est pas trop mal comme ça, je suppose qu'il faut accepter les limites du procédé.
Une dernière chose : est-il possible de spécifier une taille à cette ombre dégradée ?

Bonne fin d'année !