Mon sous menu disparait

gaya_102 -  
vincent170186 Messages postés 329 Statut Membre -
Bonjour,
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.

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

/**********************************************************
				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 */

}


<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>


merci d'avance
A voir également:

26 réponses

gaya_102
 
plus de sous menu

/**********************************************************
				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 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 */

}
0
vincent170186 Messages postés 329 Statut Membre 52
 
dans:

#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;
}

enleve :
display: none;

ce qui donne :

#menuHorizon li ul {
position: absolute;
top: 28px;
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;
}

et le code html donneras :

<div id="second">
<ul id="menuHorizon" >
<li class="deroulant" onMouseOver='fermer()' 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" onMouseOver='fermer()' style="width:110px" onMouseOver='aff (1)'><a href="mariage.php">mariage</a>
<ul id="soumen1" style="display:none">
<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" onMouseOver='fermer()' style="width:110px" onMouseOver='aff (2)'><a href="mariage.php">Naissance</a>
<ul id="soumen2" style="display:none">
<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" onMouseOver='fermer()' 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" onMouseOver='fermer()' style="width:110px"><a href="mariage.php">Contact</a>

</div>

allez on y croit....

0
gaya_102
 
snif plus de sous menu

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

<div id="second">
<ul id="menuHorizon" >
<li class="deroulant" onMouseOver='fermer()' 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" onMouseOver='fermer()' style="width:110px" onMouseOver='aff (1)'><a href="mariage.php">mariage</a>
<ul id="soumen1" style="display:none">
<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" onMouseOver='fermer()' style="width:110px" onMouseOver='aff (2)'><a href="mariage.php">Naissance</a>
<ul id="soumen2" style="display:none">
<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" onMouseOver='fermer()' 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" onMouseOver='fermer()' 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: 28px;
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 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 */

}
0
vincent170186 Messages postés 329 Statut Membre 52
 
bon ben ecoute désolé je vois pas et la je vais partir (horaire de fonctionnaire...) donc si une bonne ames veux s'occuper de toi....(un conseil reposte un mess....)
voila...
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
gaya_102
 
merci de ton aide en tout cas
moi aussi je dois partir mais moi c'est au boulot lol
0
vincent170186 Messages postés 329 Statut Membre 52
 
alors bon courage..... a la revoyure...
0