Menu déroulant s'affichant dans Chrome mais pas dans IE

Réduire
X
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • Menu déroulant s'affichant dans Chrome mais pas dans IE

    Bonjour à tous,

    Voici mon problème, j'ai créer un menu déroulant avec quelques propriétés CSS3 et notamment box-shadow et text-shadow. Sur Google Chrome cela marche très bien, cependant sur les anciennes versions d'IE le menu principal s'affiche sans les propriétés CSS3 (ça c'est normal) mais mes sous menus, eux, ne s'affichent pas du tout et je ne vois pas du tout pourquoi...

    Vous pouvez tester si vous voulez : j'ai constaté le résultat en utilisant Chrome et IE8.
    Voici l'adresse du site : www.scodijon.fr

    Merci.

    Au passage voici mon code css concernant le menu

    Code PHP:
    /* Menu déroulant */
    #Menu ul { 
      
    floatleft;
      
    padding0;
      
    margin0;
      list-
    stylenone;
      -
    moz-border-radius5px;
      -
    webkit-border-radius5px;
      
    border-radius5px;
    }

    #Menu li{
      
    background #ed1e24;
      
    height 40px;
      
    padding 0 7px;
      
    float left;
      
    margin 0 0px;
      
    width auto;
      
    line-height 30px;
      
    text-transform uppercase;
      
    font-size 14px;
      
    font-weight bold;
      
    /*-moz-border-radius: 5px;
      -webkit-border-radius: 5px;
      border-radius: 5px;*/
            
    -webkit-box-shadow:0 0 5px rgba(0,0,0,1), 
                           
    -1px 0 rgba(255,255,255,1);
           -
    moz-box-shadow:0 0 5px rgba(0,0,0,1),
                           
    -1px 0 rgba(255,255,255,1);
                
    box-shadow:0 0 5px rgba(0,0,0,1),
                           
    -1px 0 rgba(255,255,255,1);
    }
    #Menu li:hover{
    -webkit-box-shadow:1px 1px 5px black inset;
           -
    moz-box-shadow:1px 1px 5px black inset;
                
    box-shadow:1px 1px 5px black inset;
    }

    #Menu li a {
      
    color #fff;
      
    padding 0;
      
    margin 0;
      
    line-height 45px;
      
    text-shadow:0px 1px 0px rgba(0,0,0,1);
    }

    #Menu li a:hover{
      
    color #000;
      
    text-shadow:0px 1px 0px rgba(255,255,255,0.5);
    }

    /* Second niveau */

    #Menu li ul{
      
    position absolute;
      
    width 210px;
      
    font-size 12px;
      
    background-color #ed1e24;
      
    left : -999em ;/* "display : none" not seen by screen readers */
      
    border :0;
      
    margin-left : -1px;
      
    margin : -4px;
    }

    #Menu li li, #Menu li li:first-child {
      
    border 0;
      
    margin-bottom : -1px/*iphone, ipad fix*/
    }

    #Menu li li a {
      
    display inline-block;
      
    width 230px;
      
    border-top 1px solid #fff;
      
    height 20px;
    }

    #Menu ul a:hover {
      
    color#000;
      
    text-decorationnone;
    }

    #Menu ul a {
      
    text-decorationnone;
      
    background-color#ed1e24;
    }

    /* 3ème niveau et plus */

    #Menu li ul ul { 
      
    margin: -30px 230px 40px;
      
    width 120px;
    }

    #Menu li:hover ul ul, #Menu li:hover ul ul ul, #Menu li.sfhover ul ul, #Menu li.sfhover ul ul ul {
      
    left: -999em;
    }

    #Menu li:hover ul, #Menu li li:hover ul, #Menu li li li:hover ul, #Menu li.sfhover ul, #Menu li li.sfhover ul, #Menu li li li.sfhover ul { /* nested under hovered items */
      
    leftauto;


  • #2
    Re : Menu déroulant s'affichant dans Chrome mais pas dans IE

    -webkit- (pour Chrome, Safari,…)
    -moz- (pour Firefox, Flock,…)
    -o- (pour Opera)
    -ms- (pour Internet Explorer) ---- a ajouter dans tes css
    Mon site en cours de construction avec de nouvelles catégories de documents...
    https://informaticien51.fr

    Commentaire


    • #3
      Re : Menu déroulant s'affichant dans Chrome mais pas dans IE

      Merci pour ta réponse et ton conseil.

      J'ai rajouté les -ms- mais ça ne marche toujours pas. Rien n'a changé...

      Commentaire

      Annonce

      Réduire
      1 sur 2 < >

      C'est [Réglé] et on n'en parle plus ?

      A quoi ça sert ?
      La mention [Réglé] permet aux visiteurs d'identifier rapidement les messages qui ont trouvé une solution.

      Merci donc d'utiliser cette fonctionnalité afin de faciliter la navigation et la recherche d'informations de tous sur le forum.

      Si vous deviez oublier de porter cette mention, nous nous permettrons de le faire à votre place... mais seulement une fois
      Comment ajouter la mention [Réglé] à votre discussion ?
      1 - Aller sur votre discussion et éditer votre premier message :


      2 - Cliquer sur la liste déroulante Préfixe.

      3 - Choisir le préfixe [Réglé].


      4 - Et voilà… votre discussion est désormais identifiée comme réglée.

      2 sur 2 < >

      Assistance au forum - Outil de publication d'infos de votre site

      Compatibilité: PHP 4.1,PHP4, 5, 6DEV MySQL 3.2 - 5.5 MySQLi from 4.1 ( @ >=PHP 4.4.9)

      Support Version de Joomla! : | J!3.0 | J!2.5.xx | J!1.7.xx | J!1.6.xx | J1.5.xx | J!1.0.xx |

      Version française (FR) D'autres versions sont disponibles depuis la version originale de FPA

      UTILISER À VOS PROPRES RISQUES :
      L'exactitude et l'exhaustivité de ce script ainsi que la documentation ne sont pas garanties et aucune responsabilité ne sera acceptée pour tout dommage, questions ou confusion provoquée par l'utilisation de ce script.

      Problèmes connus :
      FPA n'est actuellement pas compatible avec des sites Joomla qui ont eu leur fichier configuration.php déplacé en dehors du répertoire public_html.

      Installation :

      1. Téléchargez l'archive souhaitée : http://afuj.github.io/FPA/

      Archive zip : https://github.com/AFUJ/FPA/zipball/master

      2. Décompressez le fichier de package téléchargé sur votre propre ordinateur (à l'aide de WinZip ou d'un outil de décompression natif).

      3. Lisez le fichier LISEZMOI inclus pour toutes les notes de versions spécifiques.

      4. LIRE le fichier de documentation inclus pour obtenir des instructions d'utilisation détaillées.

      5. Téléchargez le script fpa-fr.php à la racine de votre site Joomla!. C'est l'endroit que vous avez installé Joomla et ce n'est pas la racine principale de votre serveur. Voir les exemples ci-dessous.

      6. Exécutez le script via votre navigateur en tapant: http:// www. votresite .com/ fpa-fr.php
      et remplacer www. votresite .com par votre nom de domaine


      Exemples:
      Joomla! est installé dans votre répertoire web et vous avez installé la version française du fichier FPA:
      Télécharger le script fpa-fr.php dans: /public_html/
      Pour executer le script: http://www..com/fpa-fr.php

      Joomla! est installé dans un sous-répertoire nommé "cms" et vous avez installé la version française du fichier FPA:
      Télécharger le script fpa-fr.php dans: /public_html/cms/
      Pour executer le script: http://www..com/cms/fpa-fr.php

      En raison de la nature très sensible de l'information affichée par le script FPA, il doit être retiré immédiatement du serveur après son utilisation.

      Pour supprimer le script de votre site, utilisez le lien de script de suppression fourni en haut de la page du script. Si le lien de suppression échoue pour supprimer le script, utilisez votre programme FTP pour le supprimer manuellement ou changer le nom une fois que le script a généré les données du site et le message publié sur le forum. Si le script est toujours présent sur le site, il peut être utilisé pour recueillir suffisamment d'informations pour pirater votre site. Le retrait du script empêche des étrangers de l'utiliser pour jeter un oeil à la façon dont votre site est structuré et de détecter les défauts qui peuvent être utilisé à vos dépends.
      Voir plus
      Voir moins
      Travaille ...
      X