Version complète: sur le forum Webmaster Hub : Problème compatibilité menu déoulant avec IE
Webmaster Hub > Informatique & Internet > Les Navigateurs
Djames-Allen
vendredi 5 septembre 2008 à 15:51
Bonjour le Hub,

J'ai un petit souci aujourd'hui avec un menu déroulant, les onglets qui doivent se dérouler au survol de la souris s'effectue bien sous Mozilla et Opéra mais alors IE sick.gif . J'ai recherché le beug en vain mais je ne vois pas d'où cela pourrait venir.

Si l'un de vous à le temps de jeter un coup d'oeil, voici le code source ci-dessous, et le site si vous voulez voir le menu c'est le site sur le foot en signature.

Je vous remercie sincèrement de votre aide.

Bon weekend Djames wink.gif

Voici mon code source;
CODE
    <div class="navcontainer">  
               <ul class="navlist">    
                   <li><a href="#"class="current">Actualité</a></li>
                   <li><a href="#">Transfert</a></li>
                   <li class="active"><a href="#">France</a>
                       <ul class="subnavlist">
                        <li class="subactive"><a href="#" class="subcurrent">Ligue 1</a></li>
                        <li><a href="#">Equipe de france</a></li>
                       </ul>
                     </li>
                   <li class="active"><a href="#">Angleterre</a>  
                       <ul class="subnavlist">
                        <li class="subactive"><a href="#"class="subcurrent">Premier league</a></li>
                       </ul>
                     </li>    
                   <li class="active"><a href="#">Espagne</a>
                       <ul class="subnavlist">
                        <li class="subactive"><a href="#" class="subcurrent">Liga</a></li>
                       </ul>
                      </li>
                   <li class="active"><a href="#">Italie</a>
                       <ul class="subnavlist">
                        <li class="subactive"><a href="#" class="subcurrent">Calcio Serie A</a></li>
                       </ul>
                     </li>
                   <li class="active"><a href="#">Europe</a>
                       <ul class="subnavlist">
                        <li class="subactive"><a href="#" class="subcurrent">Champions League</a></li>
                       </ul>
                     </li>
                   <li class="active"><a href="#">Monde</a>  
                       <ul class="subnavlist">
                        <li class="subactive"><a href="#" class="subcurrent">Coupe du Monde</a></li>
                        <li><a href="#">Coupe d'Afrique</a></li>
                       </ul>
                     </li>
               </ul>
       </div>


Et pour le CSS:
CODE
   /*-----------------------------------------------------
       /* CSS Menu
       /*---------------------------------------------------*/
      
       .navcontainer{
       position: absolute;
       margin-top: 10px;    
       margin-left: 0px;
       width: 100%;}
      
       .navlist { font-family: sans-serif; }
      
       .navlist a
       {
       font-weight: bold;
       text-decoration: none;
       }
      
       .navlist, .navlist ul, .navlist li
       {
       margin: 0px;
       padding: 0px;
       list-style-type: none;
       }
      
       .navlist li { float: left; }
      
       .navlist li a
       {
       color: #ffffff;
       background-color: #fba734;
       padding: 3px;
       border: 1px #ffffff outset;
       }
      
       .navlist li a:hover
       {
       color: #333333;
       background-color: #ffffff;
       }
      
       .navlist li a:active
       {
       color: #cccccc;
       background-color: #003366;
       border: 1px #ffffff inset;
       }
      
       .subnavlist { display: none; }
       .subnavlist li { float: none; }
      
       .subnavlist li a
       {
       padding: 0px;
       margin: 1px;
       }
      
       .navlist li:hover .subnavlist
       {
       display: block;
       position: absolute;
       font-size: 8pt;
       padding-top: 5px;
       }
      
       .navlist li:hover .subnavlist li a
       {
       display: block;
       width: 10em;
       border: none;
       padding: 2px;
       }
      
       .navlist li:hover .subnavlist li a:before { font-size: 1.09em; content: " >> "; }
iNCiTE Web
vendredi 5 septembre 2008 à 18:34
Pour ce genre de test, rien ne vaut une page en ligne... tu auras plus de testeurs volontaires que si il faut créer une page copier ton code, corriger ce qui manque etc...
Et tu ne précises pas quelle version d'IE ? IE6 par exemple n'aime pas :hover ailleurs que sur des liens "a"
Djames-Allen
vendredi 5 septembre 2008 à 18:59
Salut Incite web wink.gif

Tout d'abord merci pour ton aide, excuse-moi mais je parlais du deuxième site en signature.

Actu-Foot le menu est en ligne même s'il y a le beug, je l'ai laissé. Concernant la version d'internet explorer, c'est le IE 6, désolé de ne pas l'avoir mentionné, mais je pense que ca ne doit pas fonctionner pour tous les IE.

Merci pour ton aide.

Cordialement Djames.

EDIT

j'ai modifié le menu pour ne plus avoir ce beug, donc le problème est corrigé merci.

Djames wink.gif
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.