Remettre en ordre mon menu déroulant
Résolu
gaya_102
-
gaya_102 -
gaya_102 -
Bonjour,
http://www.lemondedegaya.fr/mariage2.php
mon menu a des soucis.
Je voudrais que mes images se suivent et que mes rollover fonctionnent mais je n'y arrivent pas
css de mon menu déroulant
le page de mon menu
merci d'avance de votre aide
http://www.lemondedegaya.fr/mariage2.php
mon menu a des soucis.
Je voudrais que mes images se suivent et que mes rollover fonctionnent mais je n'y arrivent pas
css de mon menu déroulant
/********************************************************** STYLES GENERAUX **********************************************************/ img { border: 0; display: block; } #logo { float: left; } /*********************************************************** MENU HORIZONTAL **********************************************************/ #menuHorizon { margin-left: 90px; padding: 0; margin: 0; } #menuHorizon li { position: relative; float: left; /* mes les boutons sur la gauche*/ list-style: none; font-family: times, Helvetica, sans-serif; text-decoration: none; } #menuHorizon li a { /* sous menu of*/ display: block; line-height: 25px;/* hauteur de chaques boutons des sous menus*/ text-decoration: none; color: green;/* couleur de la police*/ width:100%; } #menuHorizon li a:hover{ /* sous menu on*/ background-color: black;/* couleur du fond du sous menu en on*/ color: pink; /* couleur de la police sous menu en on*/ } #menuHorizon li ul { position: absolute; display: none; left: 0; /* deplace les sous menu vers la droite*/ padding: 0;/* marge a l'interieur des sous menus vers les bord*/ margin: 0; border: 1px solid #000; background: #fff; /* indiqueras une couleur de fond blanche */ } #menuHorizon li:hover > ul { display: block; } #menuHorizon li ul li { float: none; width: 170px;/* largeur des sous menu*/ border:0px solid #000; /* créeras une bordure noir de 1 px tout autour de chaque lien */ } #menuHorizon li ul li a { width:158px; padding: 0 5px; /* hauteur et largeur de l'ensemble de sous menu*/ border:1px solid #000; /* créeras une bordure noir de 1 px tout autour de chaque lien */ }/********************************************************** STYLES GENERAUX **********************************************************/ img { border: 0; display: block; } #logo { float: left; } /*********************************************************** MENU HORIZONTAL **********************************************************/ #menuHorizon { margin-left: 90px; padding: 0; margin: 0; } #menuHorizon li { position: relative; float: left; /* mes les boutons sur la gauche*/ list-style: none; font-family:Comic Sans MS, Times New Roman, Times, serif; text-decoration: none; } #menuHorizon li a { /* sous menu of*/ display: block; line-height: 22px;/* hauteur de chaques boutons des sous menus*/ text-decoration: none; font-size: 17px; color: #b04cbf;/* couleur de la police*/ width:100%; } #menuHorizon li a:hover{ /* sous menu on*/ background-color: #f8d8fc;/* couleur du fond du sous menu en on*/ color: purple; /* couleur de la police sous menu en on*/ font-size: 17px; } #menuHorizon li ul { position: absolute; top: 28px; display: none; left: 0; /* deplace les sous menu vers la droite*/ padding: 0;/* marge a l'interieur des sous menus vers les bord*/ margin: 0; border: 1px solid #000; background: #fff; /* indiqueras une couleur de fond blanche */ font-size: 15px; } #menuHorizon li:hover > ul { display: block; } #menuHorizon li ul li { float: none; width: 170;/* largeur des sous menu*/ border:0px solid #000; /* créeras une bordure noir de 1 px tout autour de chaque lien */ } #menuHorizon li ul li a { width:158px; padding: 0 5px; /* hauteur et largeur de l'ensemble de sous menu*/ border:1px solid #000; /* créeras une bordure noir de 1 px tout autour de chaque lien */ }
le page de mon menu
<div id="second"> <ul id="menuHorizon"> <li class="deroulant" style="width:156px"><a href="accueil.php"><img src="images/accueil_off.jpg" alt="images/accueil_on.jpg" class="rollOver" /></a> </li> <li><img src="images/fleur_menu_page.jpg" alt="images/fleur_menu_page.jpg"/></li> <li class="deroulant" style="width:78px"><a href="mariage.php"><img src="images/mariage_off.jpg" alt="images/mariage_on.jpg" class="rollOver" /></a> <ul> <li><a href="prestataires.php">La collection</a></li> <li><a href="deroulement.php">Les différents formats</a></li> <li><a href="voyage.php">Les différents papier</a></li> </ul> </li> <li><img src="images/fleur_menu_page.jpg" alt="images/fleur_menu_page.jpg"/></li> <li class="deroulant" style="width:160px"><a href="naissance.php"><img src="images/naissance_off.jpg" alt="images/naissance_on.jpg" class="rollOver" /></a> <ul> <li><a href="prestataires.php">La collection</a></li> <li><a href="deroulement.php">Les différents formats</a></li> <li><a href="voyage.php">Les différents papier</a></li> </ul> </li> <li><img src="images/fleur_menu_page.jpg" alt="images/fleur_menu_page.jpg"/></li> <li class="deroulant" style="width:160px"><a href="divers.php"><img src="images/divers_off.jpg" alt="images/divers_on.jpg" class="rollOver" /></a> <ul> <li><a href="commentvenir.php">Comment venir</a></li> <li><a href="hebergement.php">Hébergement</a></li> </ul> </li> <li><img src="images/fleur_menu_page.jpg" alt="images/fleur_menu_page.jpg"/></li> <li class="deroulant" style="width:89px"><a href="contact.php"><img src="images/contact_off.jpg" alt="images/contact_on.jpg" class="rollOver" /></a> </li> <li><img src="images/fleur_menu_page.jpg" alt="images/fleur_menu_page.jpg"/></li> </div>
merci d'avance de votre aide
A voir également:
- Remettre en ordre mon menu déroulant
- Menu déroulant excel - Guide
- Remettre a zero un pc - Guide
- Excel trier par ordre croissant chiffre - Guide
- Excel menu déroulant en cascade - Guide
- Menu déroulant google sheet - Accueil - Guide bureautique