Guide informatique hardware En1heure.com
Articles phares : Quelle alimentation PC | Choisir son ecran LCD PC

Chercher un sujet :

Menu deroulant

Support HTML / XHTML / CSS et validation de vos sites aux standards du Web.

Messages: 8
Inscription: Ven Avr 23, 2010 2:26 pm
Menu deroulantMessagePosté: Lun Mai 03, 2010 12:29 pm

Bonjour,

Un problème peut en cacher un autre ;p

Donc j'essai de faire un menu:

HTML
Code: Tout sélectionner
<div id="menu">
   <ul>
      <li><a href="#">Accueil</a>
         <ul>
            <li><a href="#">Actualités</a></li>
            <li><a href="#">Projet</a></li>
            <li><a href="#">Calendrier</a></li>
            <li><a href="#">Indicateurs</a></li>
            <li><a href="#">Galerie</a></li>
         </ul>
      </li>
      
      <li><a href="#">Formations</a>
         <ul>
            <li><a href="#">Seconde</a></li>
            <li><a href="#">Filiere S</a></li>
            <li><a href="#">Filiere ES</a></li>
            <li><a href="#">Filiere L</a></li>
            <li><a href="#">Filiere STG</a></li>
            <li><a href="#">BTS IG</a></li>
         </ul>
      </li>
      
      <li><a href="#">Ressources</a></li>
      
      <li><a href="#">Contact</a></li>
   </ul>
</div>


Et voici le CSS
Code: Tout sélectionner
#menu ul
{
   padding-left: 0;
   margin-left: 0;
   background-color: rgb(120,120,120);
   color: White;
   width: 100%;
   float: left;
   font-family: arial, helvetica, sans-serif;
}

#menu ul li { display: inline; }

#menu ul li a
{
   padding: 0.2em 1em;
   background-color: rgb(120,120,120);
   color: White;
   text-decoration: none;
   float: left;
   border-right: 2px solid #fff;
}

#menu ul li a:hover
{
   background-color: #369;
   color: #fff;
}

#menu ul li ul {
   display:none;
}
#menu ul li:hover ul {
   display:block;
}


J'aimerais que mes sous menu se deroule verticalement et au lieu de ça ils creent une nouvelle barre de menu en dessous du menu principale et une troisieme barre où il met les "items" du menu principal suivant :/
Avatar de l’utilisateur
Administrateur
Messages: 1614
Inscription: Ven Mar 26, 2004 7:16 am
Localisation: /var/www/
Menu deroulantMessagePosté: Mar Mai 04, 2010 7:22 am

Bonjour Greg,

Comme toujours il serait bcp plus simple d'avoir un lien vers ton site, uploade juste la page en question pour y voir plus clair car lire le code comme ça, pas évident !

En tout cas mon petit doigt me dit que tu as oublié le :
position:absolute

Dans le menu qui se dévoile au rollhover ;)

Messages: 8
Inscription: Ven Avr 23, 2010 2:26 pm
Menu deroulantMessagePosté: Mar Mai 04, 2010 8:03 am

Moi je veux bien, mais je l'upload comment ?

C'est mieux avec:
Code: Tout sélectionner
position:absolute


Mais le sous menu prend la place du menu principale au lieu de se derouler verticalement en dessous.
Avatar de l’utilisateur
Administrateur
Messages: 1614
Inscription: Ven Mar 26, 2004 7:16 am
Localisation: /var/www/
Menu deroulantMessagePosté: Mar Mai 04, 2010 8:33 am

Et bien tu mets ta page sur ton hébergement et tu postes ici l'adresse ;)
Ajoute un top:1em par exemple.

Messages: 8
Inscription: Ven Avr 23, 2010 2:26 pm
Menu deroulantMessagePosté: Mar Mai 04, 2010 9:15 am

J'ai réussi à faire mon menu.

Moi je fais le site, je me charge pas de l'hebergement. Quand j'aurais fini, je le donnerais à la personne qui s'en charge. Je travaille qu'en local.

Retourner vers HTML / XHTML / CSS



Chercher un sujet :


cron