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 :
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 <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>
Merci pour votre aide.
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; }
Partager