mettre une balise img à l'intérieur d'une balise href provoque une bordure autour de l'image dans IE

Question

J'ai du HTML où j'ai des balises img à l'intérieur d'une balise href à utiliser comme bouton. Tout fonctionne bien, sauf que lorsque je l'ouvre dans IE, une bordure entoure le tag img.

Voici un code:

 <a href="javascript:changecolor(1)" title="Click Again to Change Color" style="cursor:pointer; text-decoration:none"><img src="button.png" width="25" height="25" style="margin-top:600px;" /></a>
<a href="javascript:changecolor(2)" title="Click Again to Change Color" style="cursor:pointer"><img src="button.png" width="25" height="25" style="margin-top:600px;" /></a>
<a href="javascript:changecolor(3)" title="Click Again to Change Color" style="cursor:pointer"><img src="button.png" width="25" height="25" style="margin-top:600px;" /></a>
<a href="javascript:changecolor(4)" title="Click Again to Change Color" style="cursor:pointer"><img src="button.png" width="25" height="25" style="margin-top:600px;" /></a>
<a href="javascript:changecolor(7)" title="Click Again to Change Color" style="cursor:pointer"><img src="button.png" width="25" height="25" style="margin-top:600px;" /></a>
<a href="javascript:changecolor(6)" title="Click Again to Change Color" style="cursor:pointer"><img src="button.png" width="25" height="25" style="margin-top:600px; text-decoration:none" /></a>
 

Comment puis-je me débarrasser de la bordure bleue, qui apparaît uniquement dans IE?

Answer 1

Solution simple, dans votre feuille de style, créez un style similaire à celui-ci:

 a img{
border:0;
}
 

Dans votre cas, vous pouvez mettre à jour votre style pour inclure certains des styles en ligne que vous avez dans votre code HTML. Par exemple, votre feuille de style serait mise à jour pour:

 a{
cursor:pointer;
text-decoration:none
}

a img{
margin-top:600px;
}
 

Answer 2

Ajouter un attribut border = "0" à la balise img

Answer 3

En ce qui concerne le problème mineur avec Internet Explorer et la zone grisée autour de la balise d'ancrage - il s'agit d'un contour. Pour masquer le contour, vous pouvez utiliser les CSS suivants:

 a img{outline:none;}