Logo GNT
Actualités Tests & Guides Bons Plans
Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11
Entraide Développement Développement Langage JavaScript ie hover et display block

ie hover et display block

3 réponses
Avatar
Séverin Richard
Voila,

Quand j'affecte un style="display:block" à un element <a>:

sous ff l'evenement "hover" (la souris devient une main) est déclenché
au survol de TOUT l'élément. Même si on ne survol pas le texte.

Sur ie, l'événement se déclenche uniquement au survol du texte, ce qui
est génant pour les boutons qui on "peu" de texte.

Donc je voudrais savoir si il existe une syntaxe, style ou autre chose
pour que le hover (la main) soit déclenché n'importe ou sur l'élément <A>

Il reste bien la possibilité de mettre une image..et c'est la seule que
j'ai trouvé!

Qqun a une soluce??
Signaler un problème avec ce contenu

3 réponses

Supprimer
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire

Veuillez sélectionner un problème

Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
Avatar
SAM
Séverin Richard a écrit :
Voila,

Quand j'affecte un style="display:block" à un element <a>:

sous ff l'evenement "hover" (la souris devient une main) est déclenché
au survol de TOUT l'élément. Même si on ne survol pas le texte.

Sur ie, l'événement se déclenche uniquement au survol du texte, ce qui
est génant pour les boutons qui on "peu" de texte.



Je n'ai pas ça dans mon IE.6 qui fonctionne comme Fx (pour une fois !).

CSS :
==== a { display: block; width: 80px; text-align: center; float: left;
/* padding: 3px 18px; border: 1px solid; */
color: maroon; background: azure;
text-decoration: none; margin: 2px 15px; }
a:hover { background: #ff6; color: black }

HTML :
===== <p><a href="#">menu 1</a>
<a href="#">menu 2</a>
<a href="#">menu 3</a></p>

Mais j'ai un doc-type dans mon test :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

--
sm
Avatar
Séverin Richard
SAM a écrit :
Séverin Richard a écrit :
Voila,

Quand j'affecte un style="display:block" à un element <a>:

sous ff l'evenement "hover" (la souris devient une main) est
déclenché au survol de TOUT l'élément. Même si on ne survol pas le texte.

Sur ie, l'événement se déclenche uniquement au survol du texte, ce qui
est génant pour les boutons qui on "peu" de texte.



Je n'ai pas ça dans mon IE.6 qui fonctionne comme Fx (pour une fois !).

CSS :
==== > a { display: block; width: 80px; text-align: center; float: left;
/* padding: 3px 18px; border: 1px solid; */
color: maroon; background: azure;
text-decoration: none; margin: 2px 15px; }
a:hover { background: #ff6; color: black }

HTML :
===== > <p><a href="#">menu 1</a>
<a href="#">menu 2</a>
<a href="#">menu 3</a></p>

Mais j'ai un doc-type dans mon test :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">



Merci pour le code, en effet il fonctionne.

Pour ma part, les liens <a> sont dans un tableau, c peut-etre pour ca
que le hover ne marche pas comme je veux:

avec le code ci-dessous, seul le premier "<td>" fonctionne (hover sur
toute la balise <a>).. Les autre ne marchent pas!!!

<table>
<tr><td>
<a href="#" class=to_resa style="padding:25px" >menu 2</a>
</td></tr>
<tr><td>
<a href="#" class=to_resa style="padding:25px" >menu 2</a>
</td></tr>
<tr><td>
<a href="#" class=to_resa style="padding:25px" >menu 2</a>
</td></tr>
<tr><td>
<a href="#" class=to_resa style="padding:25px" >menu 2</a>
</td></tr>
</table>

avec:
<style>
a.to_resa{
background:#ccFAcA;
color:#55aa55;
text-align:center;
padding:7px;
margin:0px;
display:block;
}
a.to_resa:hover{
border:1px solid #55aa55;
background:#dcFfdA;
color:#55aa55;
text-align:center;

}
</style>

Je crois etre en présence d'un bug (ie) de plus!!!
Avatar
Pascal PONCET
Séverin Richard a écrit :
Je crois etre en présence d'un bug (ie) de plus!!!



Bonjour,

Perso, j'ai pas de pb avec ce code dans IE7.
Je ne me souviens pas non plus que ça en posait avec IE6.
Une seule exception toutefois avec MSIE < 7, le "hover" n'est compris
que sur les balises <A> (mais c'est bien le cas dans l'exemple fourni).

Cordialement,
Pascal