menu déroulant au premier plan [Résolu]

[sserpentio]

bonjour je n'arrive pas à mettre mon menu déroulant au premier plan sous firefox (pas de probleme sur Ie8).
Mon menu déroulant se situe en haut de page et avec le hover mes menus déroulant s'ouvre mais reste derriere le corps principal de la page donc quand la souris passe sur du texte de la page mon menu disparait. je ne sais pas quel fonction en CSS je pourrai mettre pour obliger l'affichage de mon menu au premier plan.

Merci pour vos réponses en avance.

Exemples de code utilisés:

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
#menu
{
	background-color: #160f79;
    opacity: 0.8; 
	width: 1280px;
	height: 30px;
	list-style-type: none;
	margin: 0;
	margin-top: 130px;
	padding: 0;
	border: 0;
	position:fixed;
	top: 0;
	left: 0;
}
#menu li
{
	float: left;
	width: 160px;
	margin: 0;
	padding: 0;
	border: 0;
}
#menu li a:link, #menu li a:visited
{
	display: block;
	height: 1%;
	color: #1db2ea;
	background: #160f79;
	margin: 0;
	padding: 4px 8px;
	border-right: 1px solid #fff;
	text-decoration: none;
}
#menu li a:active { background-color: #160f79; }
#menu li a:hover
{
	background-image: none;
	background-color: #8a0c24;
	color: #f5f02b;
}
#menu .sousMenu
{
	display: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	border: 0;
}
#menu .sousMenu li
{
	float: none;
	margin: 0;
	padding: 0;
	border: 0;
	width: 160px;
 
}
#menu .sousMenu li a:link, #menu .sousMenu li a:visited
{
	display: block;
	color: #1db2ea;
	margin: 0;
	border: 0;
	text-decoration: none;
	background-color: #160f79;
 
}
#menu .sousMenu li a:hover
{
	background-image: none;
	background-color: #8a0c24;
	color: #f5f02b;
 
}
 
#menu li:hover > .sousMenu { display: block; }

[Torgar]

Bonsoir,

Il faut faire un positionnement CSS et jouer avec la profondeur via la propriété z-index.

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
#menu
{
    background-color: #160f79;
    opacity: 0.8; 
    width: 1280px;
    height: 30px;
    list-style-type: none;
    margin: 0;
    margin-top: 130px;
    padding: 0;
    border: 0;
    position:fixed;
    top: 0;
    left: 0;
position: relative; /* ou absolute ça dépend de ton design */
z-index: 10; /* A adapter au besoin */
}

[sserpentio]

Envoyé par Torgar

Bonsoir,

Il faut faire un positionnement CSS et jouer avec la profondeur via la propriété z-index.

Merci Beaucoup Torgar mon problème est résolu je ne connaissais pas la fonction z-index. Je vais me pencher sur cette fonction.

Bonne soirée