28172 sujets

CSS et mise en forme, CSS3

[css] problem avec hover...

Bonjour,



Je rencontre un problème avec mon css...



J'ai une div parent, une div enfant sur laquelle j'ai mis un :before qui recouvre toute la zone pour permettre un lien cliquable sur toute la zone.



Je voudrai mettre une ombre sur le parent lors de l'hover mais le :before ne laisse pas passer la chose.



Avez-vous une solution ? Voici la page qui pose problème : je n'arrive pas à mettre le lien, c'est la page "Entrainement" du site Espace Musculation
Bonjour,

Sans lien c'est difficile de constater le soucis. Néanmoins la chose suivante est impossible en Css
musculation a écrit :
Je voudrai mettre une ombre sur le parent lors de l'hover mais le :before ne laisse pas passer la chose.

En effet, en Css on ne peut faire appliquer un effet sur un parent à l'action sur un enfant.

Tel que le problème est décrit, je vois deux alternatives. Soit appliquer l'ombre au pseudo élément. Visuellement ce ne devrait pas faire de différence à l'oeil étant donné qu'il recouvre toute la zone. Ce qui donnerait:
.enfant:hover:before {
  box-shadow: etc;
}


Ou alors revoir carrément la partie html en faisant en sorte soit que le lien englobe les éléments (qu'il ne soit plus enfant mais parent) ; solution improbable s'il s'agit d'un menu par exemple. Soit en modifiant le modèle de boite du lien pour qu'il devienne un élément de type bloc (display: bloc)auquel cas il occupera 100% de l'espace disponible ; j'ai l'intuition que c'est cette solution qu'il vous faudra retenir. En ce cas, plus besoin du pseudo-élément généré par :before.


Mais en l'état, sans code, impossible d'en dire plus.
Sujet clos
Aller à