Supprimer l'espace blanc sous l'image

Question

Dans Firefox, seules mes vignettes vidéo affichent de mystérieux 2-3 pixels d'espace blanc entre le bas de l'image et sa bordure (voir ci-dessous).

J'ai essayé tout ce que je peux imaginer dans Firebug sans succès.

Comment supprimer cet espace blanc ?

Answer 1

Vous voyez l'espace pour les jambages descendants (les bouts qui pendent au bas des "y" et des "p") parce que img est un élément en ligne par défaut. Cette opération supprime l'espace :

.youtube-thumb img { display: block; }

Answer 2

Vous pouvez utiliser le code ci-dessous si vous ne souhaitez pas modifier le mode bloc :

img{vertical-align:text-bottom}

Vous pouvez également utiliser la méthode suivante, comme le suggère Stuart :

img{vertical-align:bottom}

Answer 3

Si vous souhaitez conserver l'image en ligne, vous pouvez mettre vertical-align: top ou vertical-align: bottom sur elle. Par défaut, il est aligné sur la ligne de base, d'où les quelques pixels en dessous.

Answer 4

J'ai trouvé cette question et aucune des solutions proposées n'a fonctionné pour moi. J'ai trouvé une autre solution qui m'a permis de me débarrasser des espaces sous les images dans Chrome. J'ai dû ajouter line-height:0; au sélecteur img dans mon CSS et les espaces sous les images ont disparu.

C'est fou que ce problème persiste dans les navigateurs en 2013.

Answer 5

J'ai eu ce problème, j'ai trouvé la solution parfaite ailleurs, si vous ne voulez pas utiliser le bloc, ajoutez simplement

img { vertical-align: top }