[RÉGLÉ] PB menu déroulant css

[Allen Blocci]

Bonjour,

Je me suis lancé dans le développement de mon template Joomla. J'ai un petit problème avec mon menu déroulant horizontal. Le premier Item de la liste verticale, celui qui est toujours visible, n'est pas interactif, il n'est pas cliquable...

Voici le site en plein chantier, http://www.lokazionel.fr/fr/ et l'onglet Actualités par exemple n'est plus actif.

Mon code css pour les menus :

/* TYPO DES MENUS NIVEAU 0*/

ul.menu li {
 padding:0;
 list-style-type:none;
 text-transform:uppercase;
 float:left; /*pour IE*/
 border-left:1px solid white;
  width:142px;

 }

ul.menu li a {
 display:block;
 float:left; 
 width:142px;
 line-height:23px;
background-image:url(../../../images/bouton_mainmenu.png); 
background-repeat-repeat-x;
 color:#FFF;
 font-weight:500;
 text-decoration:none;
 text-align:center;
 }
 
ul.menu li a:hover {
 background:#000;
 color:white;
 }  
 
 /* TYPO SOUS MENUS NIVEAU 1*/

ul.menu ul 
{
display:none;
}  

ul.menu li:hover ul
{
display:block;
position:absolute;
float:none;
}  

ul.menu li:hover ul li 
{
position:relative;
Top:23px;
left:-41px;
float:none;

}  

ul.menu li:hover ul li a:hover 
{
background: #000000;
}

Par avance, merci de votre aide !

[toffffe]

Re : PB menu déroulant css

Salut
Petite piste il devient cliquable si tu retire le list-style-type: none sur ul li dans ul.menu li

Pourquoi ne pas utiliser un module type maximenuck ? pour le menu déroulant

[Allen Blocci]

Re : PB menu déroulant css

Salut
Petite piste il devient cliquable si tu retire le list-style-type: none sur ul li dans ul.menu li

Apparemment non... De plus cela rajoute les points à ma liste.

Salut
Pourquoi ne pas utiliser un module type maximenuck ? pour le menu déroulant

Je ne connaissais pas ce module, j'ai donc tenté de faire les css moi-même. Je vais me repencher dessus.

Merci

[toffffe]

Re : PB menu déroulant css

Le problème c'est que tes onglets qui se déroule passe au dessus de l'onglet

Je ne connaissais pas ce module, j'ai donc tenté de faire les css moi-même. Je vais me repencher dessus.

Je te conseil d'y jeter un coup d'oeil car il est vraiment super voici le lien http://www.joomlack.fr/extensions-joomla/maximenu-ck

[Allen Blocci]

Re : PB menu déroulant css

Le problème c'est que tes onglets qui se déroule passe au dessus de l'onglet

OK, j'ai résolu ce problème, mais je suis confronté à un autre : mon menu qui se déroule vers le bas repousse le reste de la page. Il semble que je n'ai pas bien compris les positions:absolute et relative...

Voici le code de mes sous-menu :

*/* TYPO SOUS MENUS NIVEAU 1*/

ul.menu ul 
{
Top:23px;
display:none;
}**

ul.menu li:hover ul
{
display:block;

float:none;

}**

ul.menu li:hover ul li 
{
position:relative;
left:-41px;
float:none;

}**

ul.menu li:hover ul li a:hover 
{
background: #000000;
**
}

[Allen Blocci]

Re : PB menu déroulant css

Voilà une solution qui semble finctionner :

/* TYPO DES MENUS NIVEAU 0*/

ul.menu li {
 position:relative;
 z-index:2;
 padding:0;
 list-style-type:none;
 text-transform:uppercase;
 float:left; /*pour IE*/
 border-left:1px solid white;
  width:142px;

 }

ul.menu li a {
 display:block;
 float:left;
 width:142px;
 line-height:23px;
background-image:url(../../../images/bouton_mainmenu.png);
background-repeat-repeat-x;
 color:#FFF;
 font-weight:500;
 text-decoration:none;
 text-align:center;
 }
 
ul.menu li a:hover {
 background:#000;
 color:white;
 }  
 
 /* TYPO SOUS MENUS NIVEAU 1*/

ul.menu ul
{
Top:23px;
display:none;

}  

ul.menu li:hover ul
{
display:block;
position:absolute;
float:none;

}  

ul.menu li:hover ul li
{
position:relative;
left:-41px;
float:none;

}  

ul.menu li:hover ul li a:hover
{
background: #000000;  
}