Discussion :

[nagadscar]

Bonjour à tous !

Bon, je suis un peu moins débutant en css/html (2 semaines maintenant \o/).

En utilisant divers menu et autre trouvés sur le net, j'ai donc fait le mien. Par contre, je pense qu'il y a pas mal de choses qui ne servent à rien ou autre donc j'aimerai que l'on m'aide à "purger" ce fichier (j'ai déjà fait ce que je pouvais, mais je continu a chercher ^^).

J'en suis donc là :

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
96
97
98
99
100
101
102
103
104
105
106
#nav {
    margin: 50px -25px -25px 0;
    display:block;
    height:39px;
    font-size:11px;
    font-weight:bold;
    background-color:#FFF;
    font-family:Arial,Verdana,Helvitica,sans-serif;
    border-top:4px solid #B30000;
    -moz-opacity:0.7;
    opacity: 0.7;
    filter:alpha(opacity=70);
}
#nav li {
    display:block;
    float:left;
    margin:0;
    list-style: none;
}

#nav a {
    font-weight: bold;
    text-decoration: none;
    display: block;
    padding:  8px 20px;
    margin: 0;
    color:#000;
}
#nav a:hover {
    background-color:#666;
}
#nav ul li:hover a, #nav li:hover li a {
    color:#000;
}
#nav ul a:hover {
    color:#CCC;
}

#nav li:hover > ul 
{
    display: block;
}

/* level 2 list */
#nav ul {
    margin: 0;
    padding: 0;
    left: 0;
    border: solid 1px #b4b4b4;

    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;

    display: none;    
}
#nav ul li {
    float: none;
    margin: 0;
    padding: 0;
}

#nav ul a {
    font-weight: normal;
    text-shadow: 0 1px 0 #fff;
}

#nav ul ul {
    left: 181px;
    top: -3px;
}
#nav ul li:first-child > a {
    -webkit-border-top-left-radius: 9px;
    -moz-border-radius-topleft: 9px;

    -webkit-border-top-right-radius: 9px;
    -moz-border-radius-topright: 9px;
}
#nav ul li:last-child > a {
    -webkit-border-bottom-left-radius: 9px;
    -moz-border-radius-bottomleft: 9px;

    -webkit-border-bottom-right-radius: 9px;
    -moz-border-radius-bottomright: 9px;
}
#nav:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
#nav 
{
    display: inline-block;
} 
html[xmlns] #nav /*@*/
{
    display: block;
}
 
* html #nav /*@*/
{
    height: 1%;
}

Je précise que ca fonctionne bien et que j'obtiens ce que je souhaite, mais comme je souhaite bien débuter, j'aimerai savoir quels choses ne servent à rien etc.

J'ai aussi rajouté des commentaires avec un /*@*/ indiquant que je ne connait pas l'utilitée de tel ou tel truc.

Merci à ceux qui prendront le temps de m'accompagner =)

cdlt, naga


PS :
dans

Code :

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

#nav li:hover > ul

que représente de '>' ?

[polymorphisme]

Bonjour nagadscar,

pour comprendre le rôles des sélecteurs, tu peux consulter le tutoriel :
http://css.developpez.com/tutoriels/...lecteur-css-3/

"purger"

Cela ne signifie pas grand chose, car le code que tu utilise dépends en autre de
- les navigateurs que tu compte prendre en charge,
- la présentation que tu souhaite obtenir,
- la version des CSS que tu as retenu,
- etc.

[nagadscar]

Cela ne signifie pas grand chose, car le code que tu utilise dépends en autre de
- les navigateurs que tu compte prendre en charge,
- la présentation que tu souhaite obtenir,
- la version des CSS que tu as retenu,
- etc.

Oui je comprend bien et je sais que pour vraiment faire un trie, il faudrai que vous voyez ce que je souhaite obtenir.

C'est juste que de moi-même, j'ai retiré certaines lignes (mon fichier css étant en partie "pompé" sur plusieurs autres) et le résultat était le même =)

tant pis, je vais me débrouiller

merci,
naga