Discussion :

[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 :

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
 
<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 :

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
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 :

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

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

C'est pas plutôt :

Code :

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

#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 :

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

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 :

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

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