Rayon de bordure CSS - élément parent chevauchant un enfant

Question

J'ai le balisage suivant: http://www.webdevout.net/test?011 Comme vous pouvez le voir, l'élément "li" chevauche les bordures arrondies définies pour la boîte.

Existe-t-il un moyen d'éviter cela en dehors de l'application du coin directement sur le dernier "li"?

Merci

Answer 1

Vous pouvez déplacer la couleur d'arrière-plan .box et supprimer la bordure en bas de la dernière li:

.box { 
    background-color: #E6E6E6; 
} 

#vmenu li:last-child a { 
    border-bottom: none; 
} 

Sur une note de côté, vous n'avez pas besoin div autour, il suffit d'ajouter la classe .box au ul.