[CSS] Problèmes entre liens images et liens textes

Problèmes entre liens images et liens textes [CSS] - HTML/CSS - Programmation

Marsh Posté le 03-03-2007 à 14:09:22    

Bonjour,
J'ai un petit soucis de CSS. L'attribut CSS de lien "marche" 2 fois pour mes images qui sont des liens, il joue les 2 suivants :
 
a {
  text-decoration: none;
  color: #000000;
  border: 1px solid #FF0000;
}
a:hover {
  border: 1px solid #FF0000;
  background-color: #FF0000;
}
 
a img{
  text-decoration: none;
  color: #000000;
  border: 1px solid #FF0000;
}
a:hover img{
  border: 1px solid #FF0000;
  background-color: #FF0000;
}
 
Ce qui fait que sur les liens images, j'ai un cadre qui encadre convenablement l'image en rouge comme il devrait le faire, mais j'ai aussi un rectangle supplémentaire au bas de l'image qui correspond au fonctionnement de a (en plus de a img).
 
Par ailleurs, je suis obligé de créer un a img pour les utilisateurs de Firefox car celui-ci donc n'encadre pas convenablement les images sans, contrairement à IE.

Reply

Marsh Posté le 03-03-2007 à 14:09:22   

Reply

Marsh Posté le 03-03-2007 à 16:29:19    

pourquoi il y a une bordure sur tes liens ?
et pourquoi tu redeclare partout la meme bordure ?
tu fais un peu n'importe quoi.
Quel est le résultat final que tu souhaite. Et pourquoi tous tes liens CSS sont-ils avec une bordure rouge ?

Reply

Marsh Posté le 03-03-2007 à 17:12:16    

gatsu35 a écrit :

1) pourquoi il y a une bordure sur tes liens ?
2) et pourquoi tu redeclare partout la meme bordure ?
3) tu fais un peu n'importe quoi.
4) Quel est le résultat final que tu souhaite. Et pourquoi tous tes liens CSS sont-ils avec une bordure rouge ?


1) Bordure car je souhaite encadrer mes cadres, cela fait partie de ce qui est attendu de moi.
 
2) Je la redéclare, si en interprétant mon code, tu te rends compte que je souhaite que mes liens soit encadré d'un cadre rouge, et qu'en mouseover tout le cadre devienne rouge
 
3) Les jugements de valeur tu te les gardes
 
4) L'effet recherché est que texte comme image, chaque lien ait un cadre rouge autour de l'élément en mouseout et que le tout se colore en rouge en mouseover. Le problème ici est que sous Firefox, sur un lien en image j'ai deux cadres qui apparaissent, l'un qui entoure bien comme il faut l'image et qui correspond aux "a img", et un autre qui reste au bas de l'image suivant la taille d'une police classique qui correspond à une interprétation du "a" "classique". Si je ne mets plus de "a img", dans ce cas j'aurais bien qu'un cadre sur mes images, mais sous Firefox il ne couvrira pas l'image mais la ligne à son dessous (contrairement à IE qui lui les interprétera bien). Et si j'enlève les "a" "classiques", là les images apparaitront avec le style recherché, mais bien sûr plus les liens textes.

Reply

Marsh Posté le 03-03-2007 à 18:06:33    

<a href="#"><img></a>
 
a img {border:1px solid #fff}
a:hover img {border-color:f00}
 
Ca te fait l'effet escompté, je ne vois pas pourquoi tu cherches à mettre un cadre sur le lien, alors que le lien peut ne pas avoir de bordure quand il n'y a pas d'image.

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed