[Résolu] Problème avec le li:hover

Salut

Ton code est-il testable quelque part ? s'il ne l'ai pas, peux-tu le simuler avec https://codepen.io/pen/

Salut @PhillipeC il faut juste appliquer le changement sur le bon élément. C'est ton <li> qui a un fond vert et un padding, mais au survol tu changes la couleur et le fond du <a>.
Je te suggere :
- de déplacer le background et le padding du .btn sur le <a> directement.
- de mettre le hover directement sur le <a> et pas sur le .btn

(et +1000 pour JENCAL pour le code en ligne, c'est la meilleure chose a faire si tu veux une aide rapide. Une image de code c'est l'avant dernière des choses à faire, la dernière étant l'absence de code hahaha )
Modifié par _laurent (21 Feb 2019 - 16:08)

_laurent a écrit :
Salut @PhillipeC il faut juste appliquer le changement sur le bon élément. C'est ton li quia un fond vert et on padding, mais au survol tu change la couleur et le fond du

Hello

Pourtant au survol il est bien sur le <li>

li.btn:hover

Par contre effectivement c'est à cause du padding ^^

_laurent a écrit :
Salut @PhillipeC il faut juste appliquer le changement sur le bon élément. C'est ton &lt;li&gt; qui a un fond vert et un padding, mais au survol tu changes la couleur et le fond du &lt;a&gt;.
Je te suggere :
- de déplacer le background et le padding du .btn sur le &lt;a&gt; directement.
- de mettre le hover directement sur le &lt;a&gt; et pas sur le .btn

(et +1000 pour JENCAL pour le code en ligne, c'est la meilleure chose a faire si tu veux une aide rapide. Une image de code c'est l'avant dernière des choses à faire, la dernière étant l'absence de code hahaha )

Bonjour Laurent merci pour ta réponse mon code marche parfaitement désormais
Cordialement

JENCAL a écrit :

Hello

Pourtant au survol il est bien sur le &lt;li&gt;

li.btn:hover

Par contre effectivement c'est à cause du padding ^^

Oui effectivement mon problème venait du fait que j'avais attribué le padding et le background à nav. ul li.btn {} et non au au <a>
En tout merci pour ton aide et le conseil d'un simulateur en ligne
Cordialement

_laurent a écrit :

nav.menu ul li.btn:hover a {
    background-color: white;
}

Au survol du li oui mais la couleur de fond s'applique au &lt;a&gt; alors que la couleur verte de base a été donné au &lt;li&gt;. Si on change la couleur du même élément on a pas ce genre de surprise !

ah oui merde... my bad ^^