Vous n'êtes pas identifié.

Annonce

#1 Problème de menu déroulant vertical du 12-12-2014 21:08:11

bruno.h.88
c00lnaute nouveau
Date d'inscription: 07-08-2014
Messages: 9

Problème de menu déroulant vertical

Bonjour à tous,

J'ai un petit problème avec mon menu déroulant vertical.

Quand je survole niveau  1 le sous niveau 1 apparait, jusque-là c'est bon et quand je survole le sous niveau 1 et que j'arrive à la hauteur de niveau 2 c'est le sous niveau  2 qui apparait,

Voici le code de ma page html,

Merci de m'apporter votre aide.


Code:

<!DOCTYPE html>
      <html lang="fr">
           <head>
                <meta charset="utf-8" />

                <link href="../css/index.css" rel="stylesheet" type="text/css"/>
                <link rel="icon" type="image/png" href="favicon.png" />

                <meta name="robots" content="noindex">
            
            <title>Le footer ou le pied de page</title>
            <meta name="description" content="" />

            <style type="text/css">
            
/* Le menu */
#menu{
width: 80%;
float:right;
}

.navigation, .navigation ul {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0;
}                

.navigation li {
    position: relative;
    font-size: 16px;
}

.navigation a {
    display: block;
    width: 150px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background: #50020a;
}

.navigation ul {
    display: none;
    left: -999em;
    position: absolute
}

.navigation li:hover > ul {
    display: block;
    left: 150px;
    top: 0
}

.navigation li li:hover > ul {
    left: 150px;
    top: 0
}

.navigation a:hover {
    color: #50020a;
    background: #ccc
}

a {
text-decoration: none;
color: #63c6ff;
}

/* ---------------------------------- */
            
            </style>
        </head>
    <body>
    
    <div id="menu">

<ul class="navigation">
    <li><a href="#">Acceuil</a></li>
    <li><a href="#">Niveau 1</a>
        <ul>
            <li><a href="#">Sous Niveau 1.1</a></li>
            <li><a href="#">Sous Niveau 1.2</a></li>
            <li><a href="#">Sous Niveau 1.3</a></li>
            <li><a href="#">Sous Niveau 1.4</a></li>
            <li><a href="#">Sous Niveau 1.5</a></li>
        </ul>
    </li>

    <li><a href="#">Niveau 2</a>
        <ul>
            <li><a href="#">Sous Niveau 2.1</a></li>
            <li><a href="#">Sous Niveau 2.2</a>
                <ul>
                    <li><a href="#">Sous-menu 2.2.1</a></li>
                    <li><a href="#">Sous-menu 2.2.2</a></li>
                    <li><a href="#">Sous-menu 2.2.3</a></li>
                    <li><a href="#">Sous-menu 2.2.4</a></li>
                    <li><a href="#">Sous-menu 2.2.5</a></li>
                </ul>
            </li>    
        </ul>
    </li>
    
    <li><a href="#">Niveau 3</a>
        <ul>
            <li><a href="#">Sous Niveau 3.1</a></li>
            <li><a href="#">Sous Niveau 3.2</a></li>
            <li><a href="#">Sous Niveau 3.3</a></li>
        </ul>
    </li>
</ul>
</div>


      </body>
</html>

Hors ligne

 

12-12-2014 21:08:11

Mister $$$


Propulsé par PunBB
© Copyright 2007
Forum créer un site

Partenaires de « créer un site internet »