Comment redimensionner une image avec une largeur et une hauteur égales sans distorsion?
J'ai une section sur ma page d'accueil qui interroge les publications récentes et saisit le titre et la vignette de chacune d'elles. Dans le fichier functions.php, j'ai spécifié une variable width et height pour la vignette à l'aide de:
add_image_size( 'thumbnail-small', 179, 147 );
Toutes mes images de taille différente sont définies dans mes articles et, lorsqu'elles sont extraites dans la vignette de la page, elles sont rognées proportionnellement, mais ne sont pas redimensionnées à la taille souhaitée:
Je mets des bordures autour des images pour que vous puissiez voir la mise à l'échelle, mais il semble que Wordpress les réduit simplement à ce qui convient le mieux.
Comment puis-je les faire se ressembler, puis supprimer l'excédent avec overflow: caché dans CSS?
J'ai essayé des CSS tels que:
// .image-mask is the wrapping div
#middle .image-mask { width:179px; height:147px; overflow: hidden; position:relative; }
#middle img { position:absolute; display: block; top:0; left:0; }
et...
#middle img{ width: auto; max-width: 150px; height: auto; max-height: 100px; }
Si vous souhaitez que WordPress recadre les images à ces dimensions absolues, vous pouvez définir l'argument $crop de add_image_size sur true, par défaut, il est false :
add_image_size( 'thumbnail-small', 179, 147, true );