IE7 affiche

Bonjour a tous, ceci est mon premier post sur ce forum, je suis bien sur embêté avec ma feuille de style et IE7.

Voici le contexte:

J'ai des items menus (li) avec des identifiants uniques.
Dans ma feuille de style j'aimerai un background différent pour chaque li

Voici ce que donne mon code:

ul#ariext72 li#ext-gen9 { background:url(templates/js_optimus_free/images/style1/bg_mainmenu.gif) no-repeat center top; }

ul#ariext72 li#ext-gen10  { background:url(templates/js_optimus_free/images/style1/bg_mainmenu_firesafety.gif) no-repeat center top; }

ul#ariext72 li#ext-gen11 { background:url(templates/js_optimus_free/images/style1/bg_mainmenu_electronics.gif) no-repeat center top; }

ul#ariext72 li#ext-gen12 { background:url(templates/js_optimus_free/images/style1/bg_mainmenu_furniture.gif) no-repeat center top; }

ul#ariext72 li#ext-gen13 { background:url(templates/js_optimus_free/images/style1/bg_mainmenu_construction.gif) no-repeat center top; }

ul#ariext72 li#ext-gen14 { background:url(templates/js_optimus_free/images/style1/bg_mainmenu_transportation.gif) no-repeat center top; }

ul#ariext72 li#ext-gen15  { background:url(templates/js_optimus_free/images/style1/bg_mainmenu_sustainability.gif) no-repeat center top; }

Tout est ok sur les principaux naviateurs (FFX, SAFARI, IE8+)
Probleme sous IE7 les items ne correspondent pas à mes sélections, pire, les 3 dernier items n'affichent aucun background.

Je suis sous Joomla 1.5.24
Avec le module ari_ext_menu

http://anthonygiraud.fr/images/stories/ffx.jpg
http://anthonygiraud.fr/images/stories/ie7.jpg

Une idee svp?

Bonjour.

Sans le html associé, difficile de t'aider, vu qu'ici le problème vient certainement d'une balise mal fermée (donc commence par passer ton code au validateur).

Tu peux pas mal alléger ton code, en simplifiant tes sélecteurs. Et pour l'effet que tu recherche, un simple border-top suffira :

#menu li {border-top: solid 3px}
#ext-gen9 {border-color: #F00}
#ext-gen10 {border-color: #FF0}
(...)

Florian_R +1

Tes sélecteurs CSS ne sont pas du tout optimisés, peut être que ça gène IE7. Cela dit, ce serait bénéfique à tous les navigateurs de les optimiser.

Un identifiant doit être unique, donc si tu as bien fait ton boulot tu peux supprimer la partie "ul#ariext72 li" de chaque sélecteur pour ne garder que l'identifiant.

Tu peux utiliser PageSpeed qui t'indiquera les sélecteurs CSS non performants dans ta feuille de styles.
Modifié par jb_gfx (06 Sep 2011 - 13:43)

merci pour ta réponse jb_gfx, j'ai limité mes sélecteurs uniquement aux identifiants uniques. Rien ne change sous IE7, toujours les backgrounds attribués aux mauvais Items...PPfff

Je suis allé sur PageSpeed, mais la je ne vois pas les "sélecteurs CSS non performants" dans le rapport.

Merci

Merci Florian,

Voici un bout du code HTML.( généré dynamiquement par Joomla)

<div id="ariext72_container" class="ux-menu-container ux-menu-clearfix" style="z-index: 9999;">
<ul id="ariext72" class="ux-menu ux-menu-horizontal">
<li id="ext-gen9" class="ux-menu-item-main ux-menu-item-level-0 ux-menu-item-parent ux-menu-item1 ux-menu-item-parent-pos0">
<li id="ext-gen10" class="ux-menu-item-main ux-menu-item-level-0 ux-menu-item-parent ux-menu-item6 ux-menu-item-parent-pos1">
<li id="ext-gen11" class="ux-menu-item-main ux-menu-item-level-0 ux-menu-item-parent ux-menu-item73 ux-menu-item-parent-pos2">
<li id="ext-gen12" class="ux-menu-item-main ux-menu-item-level-0 ux-menu-item-parent ux-menu-item3 ux-menu-item-parent-pos3">
<li id="ext-gen13" class="ux-menu-item-main ux-menu-item-level-0 ux-menu-item-parent ux-menu-item4 ux-menu-item-parent-pos4">
<li id="ext-gen14" class="ux-menu-item-main ux-menu-item-level-0 ux-menu-item-parent ux-menu-item5 ux-menu-item-parent-pos5">
<li id="ext-gen15" class="ux-menu-item-main ux-menu-item-level-0 ux-menu-item-parent ux-menu-item7 ux-menu-item-parent-pos6">

Pour ce qui est des border-top je viens d'essayer, mais en vain, le résultat est quasi le même. Pb de selecteurs?

http://www.anthonygiraud.fr/images/stories/border-top.jpg



GGGrrnnww!!!

Il n'y a aucun contenu dans tes li?

Il n'y a aucun contenu dans tes li?

EDIT: Désolé pour le double post, si jamais un modo peux l'effacer. Merci.
Modifié par Florian_R (06 Sep 2011 - 16:57)

Florian_R, voici le contenu d'un item:

<ul id="ariext72" class="ux-menu ux-menu-horizontal">
<li id="ext-gen9" class="ux-menu-item-main ux-menu-item-level-0 ux-menu-item-parent ux-menu-item1 ux-menu-item-parent-pos0">
<a id="ext-gen2" class=" ux-menu-link-level-0 ux-menu-link-first ux-menu-link-parent " href="/index.php?option=com_content&view=article&id=3&Itemid=1&lang=en">
Flame retardants
<span class="ux-menu-arrow"></span>
</a>

C'est moi ou tu ne fermes jamais les li, en comptant sur les specs HTML5 pour sortir de là ?

Ce n'est pas MOI qui gère le code mais Joomla. La page est pourtant valide W3C :

effectivement je ne vois pas les balises de fermeture. Mais c'est bizarre, c'est relativement bien interpreté par ie6, ie8 et+. Il n'y a que ie7 qui bugg et c'est precisément celui que je dois optimiser au plus vite...

Bonjour,

Tu as un code 200 et pas de 404, pour tes images ?

EDIT: autant pour moi j'ai rien dit, ca marche sur les autres navigateurs.
Modifié par rs459 (06 Sep 2011 - 17:29)

salut rs459,

je ne peux le verifier car je suis sous mac et j'utilise un simulateur ie7 (adobe browser labs) et sur un pc j'ai deja ie9...

Je ne connais pas les erreurs200...???

Tonio17 a écrit :
Ce n'est pas MOI qui gère le code mais Joomla.

Vu la qualité du code obtenu, faut voir à changer de module.

Essaie de vérifier sous un vrai IE7 (j'en ai pas sous la main là pour te dépanner, désolé.), le problème vient peux-être de ton émulateur de IE (qui ne sont pas reconnus comme des modèles de fiabilité en règle générale).
Modifié par Florian_R (06 Sep 2011 - 20:38)

Bon alors j'ai la solution a 50%

Je dis 50% car j'ai réussi a afficher sur ie7 (en faisant un seul background de la largeur du site et avec les differentes barres de couleur). Et cela s'affiche bien sous tout les navigateurs.

Et 50% car je n'ai pas resolu clairement le probleme, je pense que le module ARI EXT MENU de Joomla génère un code incompatible a ie7.

Merci pour votre aide.

Anthony

Re bonjour,

toujours des soucis d'affichage de mon menu sous ie7.

QUESTION: Existe une ligne de commande pouvant emuler une version ie8+ au navigateur ie7?
Merci