[RÉGLÉ] étendre 5 photos sur toute la longueur de la page

[Cosmic]

bonjour
bon alors là, j'en ai une compliquée je crois...

lien: https://test.smilecollector.photos/en/alanys



Les photos sont aléatoires. Les tailles sont différentes mais toujours au nombre de 5 maximum.

Existe-t-il un moyen que la ligne prenne toute la page? comme les tailles sont variables, un min/max sur les photos ne fonctionne pas puisque je voudrais garder une hauteur identique à toutes les photos...

perso, je tourne en rond...

[pcombet]

bonjour,
je conseillerai :

• de charger les IMG avec une taille moyenne (300-400px pour s'assurer que 300x5 IMG, ca occupe tout l'ecran)
• de fixer en largeur la taille des images avec un max-width:300px par exemple (pour coller dans la taille du conteneur parent lui fixé à width:100%
• de fixer la height:à 300px par exemple
• de mettre un overflow:hidden sur le conteneur parent pour masquer les images qui deborderaient du conteneur

Le probleme de se fixer sur la hauteur des images (height), c'est que dans la mesure où leur generation est aleatoire, 5 images en portrait vont occuper visuellement un espace démesuré. Le principe de l'overflow hidden devrait corriger le probleme.
J'ai vu que vous chargiez plus de 5 photos, vous ne devriez jamais tomber dans le cas ou il n'y aurait que 2 ou 3 photos

Cdt,
Philippe

[Cosmic]

je vais tenter ça merci