CSS Menu avec border-radius sur hover

Peut-être que c'est une solution simple, mais je m'en suis tenu à cela.CSS Menu avec border-radius sur hover

Ici, j'ai mon code http://jsbin.com/ejomuv pur menu CSS

Ce que je veux faire, est de mettre à la frontière rayon bas bouton Dropdown 0px sur vol stationnaire, mais seulement sur les menus déroulants pas sur tous.

J'ai essayé, mais il ne fonctionne pas, je sais que je ne fais pas quelque chose de bien:

#nav li a .nav-dropdown:hover { 
    border-bottom-left-radius: 0px; 
    border-bottom-right-radius: 0px; 
}

Source

2012-06-04 Denees

Comme les balises d'ancrage avec des menus déroulants utilisent action au lieu de href, vous pouvez utiliser le sélecteur suivant:

#nav > li:hover > a[action]{ 
    border-bottom-left-radius: 0px; 
    border-bottom-right-radius: 0px; 
}

Exemple de travail: http://jsbin.com/ejomuv/7/

Source

2012-06-04 08:31:56

Fonctionne, mais, j'ai rendu l'arrière-plan noir, comme vous pouvez voir un détail http://jsbin.com/ejomuv/5/edit#preview, de cette façon, le bouton est toujours sans rayon en bas – Denees

Désolé, le voici http://jsbin.com/ejomuv/6/edit – Denees

@DenisHoss Désolé, j'ai raté le ': hover'. J'ai mis à jour ma réponse. –

Si la référence est correcte (que je ne peux pas dire parce que le HTML est manquant), il devrait fonctionne bien. Mais je pense que c'est exactement le problème. Peut-être essayer d'ajouter un drapeau! Important dans votre déclaration pour voir si cela aide.

Source

2012-06-04 07:50:30

HTML ne manque pas, cliquez s'il vous plaît le bouton d'édition sur la droite, pour voir le code source :) http://jsbin.com/ejomuv/edit#html – Denees

Srry ... Je n'ai pas remarqué le jsbin link;) –

Vous pouvez cibler l'élément à l'aide du > (Child selector).

#nav > li:hover > a { 
    border-radius: 6px 6px 0 0; 
}

Cela ira spécifiquement du #nav à l'enfant quand li sur plus, à l'enfant a.

Source

2012-06-04 08:49:37

CSS Menu avec border-radius sur hover

Répondre

Questions connexes