Je ne sais pas comment supprimer le soulignement de l'image dans css

Question

Le site que je suis a une image à côté d'un texte dans un lien hypertexte.

L'image est soulignée, de même que le texte. Je voudrais que l'image ne soit pas soulignée.

a { 
 
    -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
 
    -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
 
    -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
 
    transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
 
    border-bottom: dotted 1px; 
 
    color: #0066cc; 
 
    text-decoration: none; 
 
} 
 
a:hover { 
 
    border-bottom-color: transparent !important; 
 
    color: #0066cc !important; 
 
    text-decoration: none; 
 
} 
 
img { 
 
    outline: none !important; 
 
    text-decoration: none !important; 
 
    border-bottom-color: transparent !important; 
 
    border-bottom: none; 
 
    outline-width: 0px; 
 
}

<a href="domain.com"><img src="pic.gif">check this out></a>

Il ne fonctionne pas. Le soulignement disparaît si vous passez la souris sur l'image, mais je veux qu'elle ne soit jamais là.

Answer 1

Si vous souhaitez supprimer la ligne uniquement sous l'image, s'il vous plaît utiliser le code suivant: -

CSS: -

a 
{ 
    -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
    -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
    -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 

    color: #0066cc; 
    text-decoration: none; 
} 
a span{ 
border-bottom: dotted 1px; 
} 
a span:hover { 
    border-bottom-color: transparent !important; 
    color: #0066cc !important; 
    text-decoration: none; 
} 

HTML: -

<a href="domain.com"><img src="pic.gif"><span>check this out></span></a> 

Si vous voulez Pour supprimer une ligne de l'image entière et du texte, veuillez utiliser le code suivant: -

CSS: -

a 
    { 
     -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
     -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 
     -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out; 

     color: #0066cc; 
     text-decoration: none; 
    } 
a span{ 
border-bottom: dotted 0px; 
} 
a span:hover { 
    border-bottom-color: transparent !important; 
    color: #0066cc !important; 
    text-decoration: none; 
} 

HTML: -

<a href="domain.com"><img src="pic.gif"><span>check this out></span></a> 

Answer 2

Mettre le texte dans le <span></span>, enlever soulignement de lien et définir soulignent que pour cette période. Ça devrait marcher.