I figured most of my images have 3:4 aspect ratio. I used flexbox for layout. Each row has 3 images with hr
as separator. Images were not shrinking but I used min-width: 0
as you suggest here https://www.sitepoint.com/community/t/flex-shrink-behaviour-on-images-and-content/394594/4 and it works.
.work .project > img {
flex: 1 1 content;
min-width: 0;
}
Please take a look https://test.prygara.com/gallery/
I used 600x800 px image sizes (scaled down some of a bigger images and up some smaller images). Say I want to make original images a bit smaller, say 480x640, in desktop view keeping the same 3:4 aspect ratio. I did try adding width
to the above declaration or use desired width as flex-basis but it didn’t work or do I just make my images 480x640 (scale them) and upload new image size?