Souligner les liens mais pas les image avec lien

Bonjour,
J'applique plusieurs règles aux liens de mon site.
Le problème c'est que ces règles s'affichent aussi pour les image qui comportent un lien et je ne voudrais que cela ne le fasse pas!
Je vous montre mon code:

a{
border-bottom:1px solid #555;
}

Donc là les liens et les images avec liens sont soulignés.
Mais même en mettant après:

a img{
border:none;
}

Bun les images avec lien sont toujours avec une bordure d'un pixel en bas!!
Je comprends pas, j'ai une erreur?
Merci d'avance

Bonjour,

En fait, pour reprendre ton explication, ce ne sont pas des images qui comportent un lien mais plutôt les liens qui contiennent des images, et comme ta première règle met une bordure inférieure sur tous les liens, quelque soit le contenu du lien cette bordure apparaît puisqu'elle n'est pas sur le contenu mais sur le conteneur.

La solution est de faire deux classes différentes, ou en tout cas au moins une pour distinguer les liens sans bordure inférieure des autres.

Nilpohc a écrit :
ce ne sont pas des images qui comportent un lien mais plutôt les liens

Ok

Nilpohc a écrit :
La solution est de faire deux classes différentes, ou en tout cas au moins une pour distinguer les liens sans bordure inférieure des autres.

Pas compris

Ok, disons que tous les liens ont par défaut une bordure inférieure, mais que ceux avec une image n'en auront pas :

CSS:

a {
	border-bottom: 1px solid #555;
}

a.image {
	border: none;
}

HTML:

<a  class="image" href="#"><img src="image.png"></a>

Ceci suppose que tu as par ailleurs fais en sorte que l'image n'ait pas de bordure propre, sinon il faudra ajouter la règle appropriée.

plutot que de mettre une bordure inférieure, essaye d'appliquer ceci :

text-decoration:underline;
color:#555555;

J'utilise un CMS et je n'ai pas la possibilité de mettre une class à chaque image dans mon site
N'y à t'il pas une autre solution ?

nicolas g a écrit :
plutot que de mettre une bordure inférieure, essaye d'appliquer ceci :

text-decoration:underline;
color:#555555;

Le problème est que je voudrais ne colorer que la bordure mais pas le text avec ! L'avantage de la bordure aussi c'est qu'elle est un peu plus espacée du text que text-decoration

Sined_style a écrit :
Pas compris

<a href="bla bla" class="pasbordure"><img /></a>

mpop a écrit :

<a href="bla bla" class="pasbordure"><img /></a>

Merci! Bon j'ai réglé partielement ce problème.
Maintenant j'en ai un autre du même genre!
J'utilise cela pour les liens aussi:

a[href^="http://"],a[href^="ftp://"],a[href^="https://"]{
background:url(images/lien-50.gif) no-repeat right;
padding-right:17px
}
.image{
border:none;
background:transparent;
padding:0
}

Avec un lien de ce type:
<a href="http://web.icq.com/whitepages/add_me?uin=test&amp;action=add" class="image"><img src="icq.gif" alt="" /></a>
L'image lien-50.gif est affiché après le lien pourtant elle à bien la class .image qui elle devrait enlever l'imaeg de fond?
Je suis désolé c'est pas simple mon truc mais ça m'énerve lol

Re,

Désolé, mais ta classe .image n'enlève pas l'image de fond, elle ne fait que rendre la couleur de fond transparente. C'est "background-image" que tu dois utiliser, et mettre à "none".