Menu déroulant, problème de couleur

[AurelieL]

Bonjour à tous,

Voilà, je me suis lancée dans la conception de menu déroulant, pas bien difficile, mais je veux le personnaliser et j'ai un problème avec les couleurs.
Lorsque l'onglet du menu principal est actif, je n'arrive pas à obtenir la couleur paramétrée pour le menu déroulant, ça me donne la même que pour l'onglet actif.

J'ai simplifié le code pour ne mettre que ce que j'ai fait niveau couleur et bordures (oui, au niveau des bordures, j'ai le même problème concernant l'onglet actif : les valeurs de l'onglet actif sont automatiquement données aux onglets du menu déroulant et impossible de changer).

Si quelqu'un peut m'aider, ça serait super cool ! Merci beaucoup !

#menu ul li /*liste principale*/{background-color: #c30710; /*bordeaux*/}#menu a{color: white;}#menu a:hover{border-radius: 6px 6px 0px 0px;color: #fff;background-color: #424242;}#menu ul .active a{background-color: #fff; /*blanc*/color: #666; /*gris*/border-radius: 6px 6px 0px 0px;}#menu ul .active a:hover{border-radius: 6px 6px 0px 0px;color: #fff;background-color: #424242;border-color: #424242;}#menu li ul /*sous-liste*/{position: absolute;width: 102px;left: -999em; /*on envoie loin du champ de vision*/vertical-align: top;;overflow: hidden;border-bottom: 0px;}#menu li ul li{background-color: #B1B5BA; /*gris*/border-radius: 0;border-color: #B1B5BA;opacity: 1;padding-bottom: 2px;margin: auto;}#menu li ul a:hover{border-radius: 0;color: #fff;background: #424242; /*gris foncé*/border: #424242;cursor: pointer;}#menu ul .active a:hover + ul a{background-color: #B1B5BA; /*gris*/border-radius: 0;border-color: #B1B5BA;color: #fff;}

[Portekoi]

Bonjour,

Peux tu donner un lien vers une page de test car cela va être difficile sans voir exactement de quoi il en retourne.

Utilise Fiddle ( http://jsfiddle.net/ )

Merci

Portekoi

[AurelieL]

Bonjour,

Peux tu donner un lien vers une page de test car cela va être difficile sans voir exactement de quoi il en retourne.

Utilise Fiddle ( http://jsfiddle.net/ )

Merci

Portekoi

Bonjour Portekoi,

Je ne connaissais pas Fiddle...

Je pense avoir fait ce qu'il faut, voici un lien avec ce que ça m'affiche : http://jsfiddle.net/V9MPt/1/

Si pour une raison x ça ne marchait pas, je le referai. En tout cas, merci beaucoup !

Bonne journée

[Portekoi]

Bonjour,

Je suis un peu une quiche en CSS mais test ça :

http://jsfiddle.net/V9MPt/14/

Ciao

Portekoi

[AurelieL]

Super !

Ça marche ! Je ne connaissais pas le signe >, je ne l'avais jamais vu. En tout cas, ça a résolu mon problème et j'ai pu résoudre tout le reste !

Merci beaucoup !

Ciao

[Dudu]

Salut

Le signe > dans les sélecteurs CSS sert à cibler un élèment qui est l'enfant direct d'un autre élément, sans balise intermédiaire.

http://www.w3.org/Style/css3-selectors-updates/WD-css3-selectors-20010126.fr.html

[AurelieL]

Merci Dudu, oui, du coup j'ai cherché ce que ça voulait dire et c'est un petit signe bien pratique !