Mon sous menu disparait
gaya_102
-
vincent170186 Messages postés 329 Statut Membre -
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
merci d'avance
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:
- Mon sous menu disparait
- Menu déroulant excel - Guide
- Canon quick menu - Télécharger - Utilitaires
- Menu démarrer - Guide
- Windows 11 menu démarrer classique - Guide
- Windows 11 menu contextuel classique - Guide
26 réponses
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 */
}
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....
#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....
snif plus de sous menu
http://www.lemondedegaya.fr/mariage2.php
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 */
}
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...
voila...
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question