Menu Déroulant ne s'affiche pas [Résolu]

[Amerzone38]

Bonjour,

Je vous explique mon problème brièvement :

Je veux faire un menu déroulant et j'ai essayé beaucoup de tutoriel tous plus intéressant les uns que les autres seulement le menu apparaît bien jusqu’à ce que je mette le display: none. Normal qu'il disparaissent avec cet attribut par contre quand je veux le faire réapparaître avec l'attribut display: bloc ca ne fonctionne pas le menu n’apparaît pas. Voici le code html :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
<div id="header">
    	<img src="img/haut_01.png" />
        <img src="img/haut_02.png" />
        	<ul id="menu">
            	<li class="rexor"><a href="#">Rexor</a></li>
                	<ul id="sousmenu">
                    	<li><a href="#">Test</a></li>
                		<li><a href="#">Test</a></li>
                    </ul>
                <li class="marches"><a href="#">Marchés</a></li>
                <li class="metiers"><a href="#">Métiers</a></li>
                <li class="hqse"><a href="#">HQSE</a></li>
                <li class="contact"><a href="#">Contact</a></li>
       		</ul>    
    </div>

Et voici le code CSS :

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
 
body {
	text-align: center;
	margin: auto;
	padding: 10px 0 0 0;
	width: 800px;
	border: none;
}
#header {
 
}
#header img	{
	float:left;
}
.rexor {
	background-image: url(img/1_menu_rexor.png);
	float: left;
	height: 20px;
	width: 90px;
}
.marches {
	background-image: url(img/2_menu_marche.png);
	float: left;
	height: 20px;
	width: 90px;
}
.metiers {
	background-image: url(img/3_menu_metiers.png);
	float: left;
	height: 20px;
	width: 90px;
}
.hqse {
	background-image: url(img/4_menu_hqse.png);
	float: left;
	height: 20px;
	width: 90px;
}
#menu {
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	margin: 0px;
	padding: 0px;
	border: none;
	list-style-type: none;
}
#header #menu #sousmenu {
	display: none;
}
#header #menu .rexor li:hover > #sousmenu {
	display: block;
}
 
 
.contact {
	background-image: url(img/5_menu_contact.png);
	float: left;
	height: 20px;
	width: 95px;
}

Merci pour votre aide.

[Bisûnûrs]

Code :

#header #menu .rexor li:hover > #sousmenu {

C'est pas plutôt :

Code :

#header #menu li.rexor:hover > #sousmenu {

[Amerzone38]

Merci pour ta réponse mais non ca ne fonctionne toujours pas ... grrr

[Bisûnûrs]

Ah oui mais tu as un li pas fermé au bon endroit ..

Code html :

1
2
3
4
5
<li class="rexor"><a href="#">Rexor</a></li>
<ul id="sousmenu">
   <li><a href="#">Test</a></li>
   <li><a href="#">Test</a></li>
</ul>

devient

Code html :

1
2
3
4
5
6
<li class="rexor"><a href="#">Rexor</a>
   <ul id="sousmenu">
      <li><a href="#">Test</a></li>
      <li><a href="#">Test</a></li>
   </ul>
</li>

[Amerzone38]

Effectivement !!! Erreur stupide de ma part ... comme quoi un oeil neuf est souvent decisif.

Encore merci