Integrer menu CSS dans un design [Résolu]

[ericstamant]

Bonjour à tous! Je fait appelle à votre aide car je ne sait plus quoi faire pour y arriver. Voici mon site web et vous comprendrai tout!

http://www.pokersroom.ca

J'aimerais avoir un fond transparant pour le menu pour voir le design en dessous, et les sous-menu leurs mettre une couleur. En gros j'aimerais s'avoir quel code et ou le mettre pour donner une couleur différente au menu qu'au sous-menu.

Voici mon 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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
#menu, #menu ul    
{
        padding : 0;
        margin : 0;
        list-style : none; 
        line-height : 21px; 
        text-align : center; 
}
 
#menu 
{
        font-weight : bold; 
        font-family : Arial; 
        font-size : 12px; 
}
#menu a 
{
        display : block; 
        padding : 0; 
        background : gray;         
        color : #fff; 
        text-decoration : none; 
        width : 118px; 
}
#menu li       
{ 
        float : left; 
 
        border-right : 0px solid #fff;
}
 
 
html>body #menu li
{
        border-right: 1px solid transparent ; 
}
 
#menu li ul 
{ 
        position: absolute; 
        width: 144px; 
        left: -999em; 
}
 
 
#menu li ul li 
{
 
        border-top : 1px solid #fff; 
}
 
 
html>body #menu li ul li                
{
        border-top : 1px solid transparent; 
}
 
#menu li ul ul 
{
        margin    : -22px 0 0 144px ; 
 
        border-left     : 1px solid #fff ;      
}
 
 
html>body #menu li ul ul                
{
        border-left     : 1px solid transparent ; 
}
#menu a:hover     
{
        color: #000; 
        background: #fff; 
}
 
#menu li:hover ul ul, #menu li.sfhover ul ul 
{
        left: -999em; 
}
 
#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul  
{
        left: auto; 
        min-height: 0; 
}

Je vous remercie pour votre aide!

[David55]

Remplace ta class "#menu a" par

Code :

1
2
3
4
5
6
7
8
9
 
#menu a {
background:none repeat scroll 0 0 transparent;
color:#FFFFFF;
display:block;
padding:0;
text-decoration:none;
width:118px;
}

Petit conseil: utilise firebug

[ericstamant]

Hey bien je te remercie c'est déja beaucoup mieu comme cela. Mais il manque un dernier petit détail, maintenant c'est tout le menu qui est transparent. Y a t'il moyen que les sous-menu est un fond de couleur?

http://www.pokersroom.ca

Merci!

[David55]

Ajoute ceci:

Code :

1
2
3
4
 
#menu ul a{
background-color:green;
}

Bien sur remplace green par la couleur de ton choix

[ericstamant]

Super sa fonctionne, je te remercie.

[David55]

derien