Problème image lien html [Résolu/Fermé]

Signaler
Messages postés
86
Date d'inscription
samedi 17 novembre 2007
Statut
Membre
Dernière intervention
24 janvier 2010
-
 alp -
Bonjour,

Je souhaite afficher dans un tableau une suite d'image sur lesquelles ont peut cliquer. Or il y a toujours un ou deux pixel d'espace en bas de chaque images.

J'ai d'abord cru que c'était une histoire de tableau, mais quand je place une image seule, et que je clique dessus, alors le cadre de clic entourant l'image/lien me montre clairement qu'il laisse un espace juste en dessous de l'image...(pour voir le cadre de clic, il suffit de faire un clic droit ou gauche et de rester appuyer, marche sur tout les liens de tout les sites).

Comment retirer cet espace ? Je souhaite absolument qu'il n'y ait aucun espace dans mon tableau !

Mon code :

CSS:
a
{
   text-decoration: none;
   color: black;
   font-weight: bold;
}

img 
{
   border-width : 0px;
   border : 0px;
}


HTML :
echo "<a href=\"#\"><img src=\"images/miniaturePerso.png\"></a>";

Merci de votre aide ^^

12 réponses


Dans le CSS essaye de faire ça :

img 
{
   border-width : 0px;
   border : 0px;
   padding-bottom:0px;
}


Et pour le tableau ajoute lui une class en CSS:

.class-de-ton-tableau {
border-collapse:collapse;
border-spacing:0px;
}


Voilà ;)
Messages postés
86
Date d'inscription
samedi 17 novembre 2007
Statut
Membre
Dernière intervention
24 janvier 2010
6
J'ai essayé, mais sa marche pas...rien n'est changé dans l'affichage.

Le plus étrange, c'est que j'ai fait mon tableau sur une page unique, et la il n'y avait aucun espace, que se soit pour les images ou pour le tableau. Et c'est quand je veut intégrer mon tableau sur la page de mon site que sa marche plus. Un espace apparait sur chaque image cliquable. Pourtant je garde le même code CSS.
Messages postés
241
Date d'inscription
samedi 12 juillet 2008
Statut
Membre
Dernière intervention
22 juin 2015
47
Bonjour,

Si vous commencez déjà à spécifier le width et height de l'image ?
Et si c'est à l'intérieur d'une cellule d'un tableau, il faut tenir compte de la hauteur des cellules adjacentes.
Messages postés
86
Date d'inscription
samedi 17 novembre 2007
Statut
Membre
Dernière intervention
24 janvier 2010
6
Je ne pense pas que c'est une histoire de tableau, vu que l'espace apparait sur un image simple comme je le donne dans mon code du premier message.

Les images ont toutes la même taille (30X30), et mettre width=30 height=30 dans la balise img ne change rien, l'espace est toujours la.

Tu pourrai nous donner un lien ?
Messages postés
86
Date d'inscription
samedi 17 novembre 2007
Statut
Membre
Dernière intervention
24 janvier 2010
6
Le site n'est pas en ligne...mais je peut faire des screens pour montrer l'affichage.

Sur ma page ne contenant que le tableau et les images :

Image simple sur laquelle je clique : on voit que le cadre de clic a la taille exacte de l'image :
http://img188.imageshack.us/img188/8376/screen10e.jpg

Image du tableau (sans problème)
http://img200.imageshack.us/img200/2632/screen12k.jpg

Sur la page du site (ou il y a les problème) :

Image simple ou l'on voit l'espace en bas sur le cadre de clic :
http://img200.imageshack.us/img200/1936/screen11h.jpg

Image du tableau, on voit clairement le problème par rapport a l'image du dessus
http://img512.imageshack.us/img512/9817/screen13j.jpg

Et dans ton CSS et que tu as une propriété appliquer directement a table ?

Et pourquoi utilisé un tableau ????
Messages postés
86
Date d'inscription
samedi 17 novembre 2007
Statut
Membre
Dernière intervention
24 janvier 2010
6
Non j'ai rien fait sur le tableau avec le CSS. mais c'est bizarre que sa marche sur une page mais pas sur une autre...

J'utilise un tableau pour disposer mes images. C'est une carte, ou l'on peut se déplacer a l'aide des cases cliquable. Le tableau fait 9X9 cases et chaque image est unique et cliquable sur un lien vers les coordonnées de la case (pour la centrer dans le tableau).

Et si tu fais un copier coller du tableau sur la page ou ça marche sur la page ou ça ne marche pas, ça donne quoi ?
Messages postés
86
Date d'inscription
samedi 17 novembre 2007
Statut
Membre
Dernière intervention
24 janvier 2010
6
Il n'y avait pas de différence entre le CSSdes deux pages.

Mais j'ai trouvé d'où venait le problème.
Il venait de cette ligne dans le code html :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


Enlever cette ligne n'explique pas le problème mais le résous

Tu l'a remplacé par quoi ?
J'ai trouvé cette page via Google : j'ai sensiblement le meme problème mais enlever la ligne en bleu ne résout pas mon problème : une idée ?
Messages postés
241
Date d'inscription
samedi 12 juillet 2008
Statut
Membre
Dernière intervention
22 juin 2015
47
Bonjour,

Faudrait aller chercher du côté des différences dans les fichiers CSS de la bonne et de la mauvaise page ... Ce que nous ne pouvons pas faire sans ton code ...
Je sais que c'est un vieux post mais j'ai eu le même problème et chez moi cela venait du fait que j'étais revenu à la ligne dans mon code entre mon image et la balise </a>, voilà si jamais quelqu un rencontre le même probleme ça peut toujours servir...