28172 sujets

CSS et mise en forme, CSS3

Mon menu déroulant disparait

bonjour
voila mon menu est fait avec du texte et pas des images. Du coup quand la souris n'est plus sur du texte le sous menu disparait. Ce qui est normal. Je voudrais trouvé une solution pour éviter cela.

<div id="second">
    <ul id="menuHorizon">
          <li class="deroulant" style="width:110px"><a href="mariage.php">Acceuil</a>            
            </li>
 
        	  <li><img src="images/fleur_menu_page.jpg" alt="images/fleur_menu_page.jpg"/></li>
     
          <li class="deroulant" style="width:110px"><a href="mariage.php">mariage</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:110px"><a href="mariage.php">Naissance</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:130px"><a href="mariage.php">Témoignages</a>            
            
          </li>
        	  <li><img src="images/fleur_menu_page.jpg" alt="images/fleur_menu_page.jpg"/></li>
     
		   
			   <li class="deroulant" style="width:110px"><a href="mariage.php">Contact</a>            
                
	 
	 
	 
    </div>



/**********************************************************
				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: 32px;
	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 */

}


http://www.lemondedegaya.fr/mariage.php

merci de votre aide
oui mais depuis que je l'ai posté j'ai réussi a résoudre des problèmes c'est pour ca que j'ai mis dans l'autre "en partie résolu"
Dans l'autre message il y avait plusieurs problèmes que j'ai résolu.
Il ne me reste que celui la.
Sujet clos
Aller à