[RESOLU] Image : defaut d'affichage

Bonjour.
Voila le problème:
J'ai mis une image qui sert de lien. Jusque là rien d'étrange.
Mais le probleme c'est qu'une bande de la couleur du lien apparait en bas de l'image.
En fait la zone de lien depasse de l'image et c'est génant. (j'utilise firefox)
Voyez vous meme ICI (j'ai mis l'image seule et après l'image dans un lien)

Voici mon code CSS

body
{
background-color:#8f1818;
font-size:8pt;
font-family:Verdana,sans-serif; 
color:white;
}
a
{
margin:0px;
padding:0px;
}
a:visited
{
background-color:white;
color:white;
text-decoration:none;
font-weight:bold;
}
a:active
{
background-color:white;
color:white;
font-weight:bold;
}
a:link
{
background-color:white;
color:white;
text-decoration:none;
font-weight:bold;
}
a:hover
{
background-color:white;
color:#d7d7d7;
font-weight:bold;
}
img
{
border-style:none;
}

Voila si quelqu'un a la solution...
Merci d'avance.
Modifié par Savagesteel (02 Jul 2006 - 20:44)

Bonjour et bienvenue parmi nous

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle.

D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.




De plus, comme tu es dans le salon CSS, tu dois te douter que la grande majorité des sujets ici (voire tous) traitent de "Problème css".

Ton sujet va donc malheureusement vite se perdre dans la masse, tout simplement parce que tu ne donnes pas assez de précision dans ton titre
Modifié par Raphael (02 Jul 2006 - 17:44)

Bonjour Savagesteel,

Une image est un élément de type en-ligne, qui se comporte en quelque sorte comme un caractère. Par défaut, le bas de l'image se place sur la ligne de base du texte. Il reste donc en dessous un espace réservé pour les descendantes des caractères comme les lettres p, g, j, etc.

Tu peux résoudre ce problème facilement en demandant au navigateur de placer l'image tout en bas, et pas sur la ligne de base.

img {vertical-align: bottom;}

En espérant que ça te sera utile.


PS : si cette astuce répond à ta question, n'oublie pas de marquer [Résolu] dans le sujet de ton premier message. Tu peux le faire en utilisant le bouton d'édition en haut à droite, sur le premier message de ce fil.
PPS : n'oublie pas non plus de bien baliser le code dans ce premier message, comme le souligne Raphael.

Bonjour.

Tu peux aussi demander à ton image de se comporter comme un bloc :

img {display: block;}

J'ai essayé de pallier à toutes mes fautes de conduite
Désolé, et merci de m'avoir résolu ce problème très agaçant.

PS: J'avais deja vu que votre site était bien, et maintenant je sais qu'il en est de même pour le forum.
Modifié par Savagesteel (02 Jul 2006 - 20:47)