Bonjour.
 
J'ai un problème de CSS assez bizarre.  
J'ai beau tourner le problème dans tous les sens, l'analyser sous tous ses angles, je ne comprends pas d'où vient mon bug, et comment y remédier.    
 
Sur les profils de mon site, j'affiche un avatar :
http://transformice.niaou.fr/profi [...] =Kazaekiel

 
Les images d'avatar sont en 120*120, la cellule du tableau est définie comme telle :
.avatar
{
width: 120px;
height: 120px;
border: 1px solid black;
}
 
Et comme vous pouvez le voir sur l'image, un espace étrange apparait en dessous, sans qu'il ne soit défini nulle part.
La cellule d'à côté n'influence pas non plus, elle n'a pas de hauteur définie.
 
Et je rencontre exactement le même bug lorsque je veux afficher des petits avatars à côté des pseudos, dans mon forum :

 
Je suis dans l'incompréhension totale.    
Pouvez-vous m'aider ?    
Merci.

C'est étrange, je ne trouve pas non plus d'ou vient cet espace de 5px...
 
Ce que tu peux faire c'est rajouter une ligne  
 
#profil td.avatar img{float:left;}
 
Ca règle le problème, par contre vu que ton image est pas transparente, ca te bouffe les arrondis

Merci beaucoup. Cela fonctionne sans être incorrect dans le code, c'est l'essentiel.
Pour les arrondis, j'avais remarqué, j'vais devoir y réfléchir aussi.

vertical-align et tu testes toutes les valeurs dans Firebug

il ne faut surtout pas mettre un float:left, tu risque d"avoir des effets de bord.
 
Ce pseudo bug est lié au vertical-align  comme le dit phosporeloaded, il faut mettre un vertical-align:top.