IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

Menu deroulant en CSS


Sujet :

CSS

  1. #1
    Candidat au Club
    Inscrit en
    Mai 2009
    Messages
    2
    Détails du profil
    Informations forums :
    Inscription : Mai 2009
    Messages : 2
    Par défaut Menu deroulant en CSS
    Bonjour à tous,

    Voilà je desirai faire un menu deroulant en css avec entre chaque menu une image qui est une barre horizontale, le probleme est que je n'arrive pas à l'enlever cette image dans les sous menu exemple à cette adresse http://s284810043.onlinehome.fr/menu.php (menu Item 2)

    voici mon fichier menu.php

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
    <div id="menu">
    <ul>
      <li><a href="#">Item 1</a></li>
      <li><a href="#">Item 2</a>
         <ul>
          <li><a href="galerie.php">Sous-item 1</a></li>
          <li><a href="gal.php">Sous-item 2</a></li>
          <li><a href="#">Sous-item 3</a></li>
        </ul>
      </li>
      <li><a href="#">Item 3</a></li>
    </ul>
    </div>


    et voici mon fichier css:

    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
     
    #menu ul {
     margin:0;
     padding:0;
     list-style-type:none;
     text-align:center;
     font: bold 100% Tahoma;
     }
    #menu ul li {
     float: left;
    padding: 2px 2px;
    text-decoration: none;
    background: transparent url(../images/vertical.gif) center right no-repeat;
     }
     #menu li a {
     display:block;
     width:100px;
     font-family:Arial;
     font-size:12px;
     color:#5D5D5D;
     text-decoration:none;
     padding:0px;
     }
    #menu ul li ul {
     display:none;
     }
    #menu ul li:hover ul {
     display:block;
     }
    #menu li:hover ul li {
     float:none;
     }
    #menu li ul {
     position:absolute;
     }
    #menu {
     height:50px;
     }

    D'avance merci de votre aide,

    muriel

  2. #2
    Membre chevronné Avatar de desert
    Profil pro
    Inscrit en
    Mai 2007
    Messages
    414
    Détails du profil
    Informations personnelles :
    Localisation : Belgique

    Informations forums :
    Inscription : Mai 2007
    Messages : 414
    Par défaut
    Bonjour,
    Il faut rajouter background:none aux balises li des sous-menus car sinon elles héritent du background des balises li parentes (#menu li).
    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    #menu li ul li {
        background: none;
    }

  3. #3
    Candidat au Club
    Inscrit en
    Mai 2009
    Messages
    2
    Détails du profil
    Informations forums :
    Inscription : Mai 2009
    Messages : 2
    Par défaut
    merci beaucoup desert, ça marche parfaitement

    Bonne soirée

    muriel

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Centrer un menu deroulant en CSS
    Par gandalf077 dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 14/02/2008, 16h13
  2. Intégrer un Javascript à mon menu deroulant CSS
    Par Dantahoua dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 18/08/2005, 18h04
  3. [CSS-Javascript] Menu déroulant
    Par JeromeR dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 21/10/2004, 17h07

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo