28220 sujets

CSS et mise en forme, CSS3

Petit cafouillage pour un menu

Bonjour,

J'ai trouvé ce menu http://www.xs4all.nl/~peterned/examples/cssmenu.html comme exemple.

J'ai voulu l'adapter à mon site mais tous les blocs restent ouverts. J'ai du cafouiller quelquepart mais je ne voit pas où (aperçu du resultat : http://www.e-central.fr/test/test_index.php)?

Partie CSS :
.gauche {
float:left;
width: 140px;
height: 100%;
}

#menugauche ul,#menugauche li,#menugauche a {
    display:block;
    margin:0;
    padding:0;
    border:0;
  }

#menugauche ul {
    width:150px;
    border:1px solid #9d9da1;
    background:white;
    list-style:none;
  }

#menugauche li {
    position:relative;
    padding:1px;
    padding-left:26px;
    background:url("imgs/green.gif") no-repeat;
    z-index:9;
  }
#menugauche li.folder  { background:url("imgs/green.gif") no-repeat; }
#menugauche li.folder ul {
      position:absolute;
      left:120px; /* IE */
      top:5px;
    }    
#menugauche li.folder>ul { left:140px; } /* others */

#menugauche a {
    padding:2px;
    border:1px solid white;
    text-decoration:none;
    color:gray;
    font-weight:bold;
    width:100%; /* IE */
  }
#menugauche li>a { width:auto; } /* others */

#menugauche li a.submenu {
    background:url("imgs/sub.gif") right no-repeat;
  }

  /* regular hovers */

#menugauche a:hover {
    border-color:gray;
    background-color:#bbb7c7;
    color:black;
  }
#menugauche li.folder a:hover {
      background-color:#bbb7c7;
    }
  
  /* hovers with specificity */
  
#menugauche li.folder:hover { z-index:10; }
    
#menugauche ul ul, #menugauche li:hover ul ul {
    display:none;
  }

#menugauche li:hover ul, #menugauche li:hover li:hover ul {
    display:block;
  }


Partie HTML :
<div class="gauche">
        <ul id="menugauche">
          <li><a href="#"> blabla 1 </a></li>
    <li class="folder">      
      <a href="#" class="submenu"> blabla 2 </a>
      <ul>
        <li><a href="#"> blabla 3 </a></li>
        <li class="folder">
          <a href="#" class="submenu"> blabla 4</a>
          <ul>
            <li><a href="#"> blabla 5 </a></li>
            <li><a href="#"> blabla 6 </a></li>
            <li><a href="#"> blabla 7 </a></li>
          </ul>
        </li>
        <li><a href="#"> blabla 8 </a></li>
      </ul>
    </li>
    <li class="folder">
      <a href="#" class="submenu"> blabla 9</a>
      <ul>
        <li><a href="#"> blabla 10 </a></li>
        <li><a href="#"> blabla 11 </a></li>
        <li><a href="#"> blabla 12 </a></li>
      </ul>
    </li>
    <li><a href="#"> blabla 13 </a></li>>
        </ul>
      </div>


Et j'ai un > sous le menu, et je vois pas d'où il sort...
Modifié par lordbdp (14 Oct 2005 - 17:06)
ok et merci pour le > en trop mais pour le vrai gros soucis, l'affichage ?
Modifié par lordbdp (17 Oct 2005 - 14:55)
Sujet clos
Aller à