Bonjour
j'aimerais faire un menu comme sur ce site (dans le même genre)
=> http://www.sunparks.com/fr-fr
j'ai copié le code CSS d'un autre site (j'avais pas encore travailler avec cette sorte de menu), mais je trouve pas comment résoudre ce problème ; j'ai mis une photo, comment faire pour que "parc 1..." ce trouve a la même ligne verticale) que "parc", mon sous-menu est trop a droite.
un grand merci pour vos réponses.
voice mon code
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 <div id="indexCss"> <div id="indexCss2"> <ul > <li > <a class="noUnderline" href="<c:url value='/parken.htm'/>">Parc</a> <ul> <li><a href="#">Parc1 les grands monts</a></li> <li><a href="#">Parc 2 autre parc</a></li> <li><a href="#">parc3 autre parc</a></li> </ul> <li > <a href="<c:url value='/parcs.htm'/>">suite 2</a></li> <li > <a href="<c:url value='/parcs.htm'/>">suite 3</a></li> </ul> </div> </div>
mon css
mon résultat:
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 #indexCss{width: 100%; background: #fff; } #indexCss2{ width:800px; height:25px; position: relative; color:#999; margin:0px auto; font-size: 0.9em; } #indexCss2 ul{ list-style-type: none; } #indexCss2 ul li{ float:left; position:relative; } #indexCss2 ul li a{ border-right: 1px solid #e9e9e9; padding:10px; display:block; /*text-align: center;*/ color:blue; text-decoration: none; margin-right: 7em; height: 8px; margin-bottom: 2em; } #indexCss2 ul li a:hover{ background:red; color:yellow; } #indexCss2 ul li ul{ display:none; } #indexCss2 ul li:hover ul{ display:block; position:absolute; } #indexCss2 ul li:hover ul li a { background: yellow; color:red; display:block; border-bottom: 1px solid #f2f2f2; border-right: none; width: 200px; } #indexCss2 ul li:hover ul li a:hover{ background:#6dc7ec; color:#fff; }
Partager