Discussion :

[noftal]

Bonjour,

Je suis encore un grand débutant en CSS.
Je me suis inspiré de ce style de menu pour la barre de menu horizontal de mon site qui est en cours de construction (donc pas encore en ligne)

La page de mon site est décomposée en

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<div id="header">
<div id="cssmenu">
<div id="container">

La div cssmenu contient le menu horizontal en question.
La div container contient le coeur de ma page, et est situé quelques pixels sous le menu.

Lorsque mon menu contient des sous-menus (comme dans l'exemple donné sur le site cssmenumaker), un survol du menu avec la souris provoque l'apparition des sous-menus juste en-dessous. Mais ceux-ci sont masqués par mon container. Je vois juste l'ébauche de mon premier sous-menu comme le montre la copie d'écran ci-dessous.

Pouvez-vous m'indiquer comment faire en sorte que les sous-menus s'affichent bien par-dessus le container ?

[NoSmoking]

Bonjour,
tu as visiblement un problème lié à l'empilement, z-index, mais sans plus de code !?!

[Invité]

Bonjour,
ou un overflow:hidden; ?

On attend ton code pour confirmation.

[noftal]

Bonjour,
Il y a bien un overflow: hidden dans le style de mon container.
Mais si je l'enlève, ça ne change rien.
Si je rajouter un z-index: 3 (par exemple) dans le style de mon menu ça résout en effet mon pb.
J'ai donc :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
#container{
   position: relative;
   max-width: 980px;
   width: 100%;
   margin-right: auto;
   margin-bottom: 10px;   
   margin-left: auto; 
   border: 1px solid #cdcdcd;  
   border-radius: 5px;
		-moz-border-radius:5px;    
   box-shadow: 0 0 5px #cccccc;       
   background-color: #ffffff;  
   height: auto;  
   overflow: hidden;
   }

et

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
#cssmenu ul ul {
  position: absolute;
  left: -9999px;
  z-index: 3;
}

Je ne suis pas certain que ce soit la solution la plus élégante, mais bon. Je passe le sujet en résolu.

NOTA : Quel code vous faut-il ? Parce que je pense que, pour pouvoir y voir clair, il vous faut les pages php (sachant que le menu est dans le header.php et le container est dans le index.php) et l'ensemble des feuilles de style. Comme en plus, le site n'est pas encore en ligne, je ne peux même pas vous donner l'URL.

[NoSmoking]

Le CSS ne suffit pas il nous faut également voir la structure du document.

CTRL +U pour voir la source généré par le navigateur, pas la peine non plus de mettre 15874 lignes.