bonjour je suis en train de développer un menu déroulant pour le cms joomla et j'ai beaucoup de mal .
Pour x raison je n'arrive pas a changer le fond du second niveau du menu !!
je vous laisse regarder mon code complet qui n'est sûrement pas très propre...
l'idée mettre une image puis le contenu <ul><li></li></ul> des menus à deux niveaux, puis une image pour fermer le menu.
Je vous demande votre aide afin de corriger mon code.
Merci à vous.
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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95 #fond-menu { height: 50px; max-height: 50px; width: 958px; max-width: 958px; } #mhome { position: absolute; padding-top: 16px; } /* ++++++++++++++ first level ++++++++++++++ */ .header-menu ul { border: 0px; background-image: url(../images/fd_menu.png); background-repeat: repeat-x; height: 50px; max-height: 50px; width: 958px; max-width: 958px; } .header-menu li { display: inline; vertical-align: bottom; } .header-menu li a { display: inline-block; width: 191px; height: 50px; color: #6A6967; background: transparent url(../images/m-hover.png) 0 0px no-repeat; text-decoration: none; text-align: center; font-weight: bold; } .header-menu li a:hover, .header-menu li a:focus { background: transparent url(../images/m-hover.png) 0 -50px no-repeat; color: white; font-weight: bold; } /* second-level lists */ .header-menu ul li ul { display:none; position: absolute; z-index: 99; height: 29px; max-height: 29px; width: 191px; max-width: 191px; background: transparent; } .header-menu ul li:hover ul { display:block; position: absolute; z-index: 99; margin-left: 50px; } .header-menu ul li ul li.parent a:hover { color:#AA0000; background-color: white; } /*************************/ .header-menu ul li ul li.parent a { display: inline-block; width: 191px; max-width: 191px; height: 29px; color: #6A6967; text-decoration: none; text-align: center; font-weight: bold; color: black; padding: 7px 10px; background: transparent url(../images/m-line.png) 0 0px no-repeat; } .header-menu ul li ul li.parent a:hover, .header-menu ul li ul li.parent a:focus { color: black; background-color: white; font-weight: bold; }
Partager