Different heights of projects cover

[lukmarcus]

Page: https://krzysztofszumny.com/projects

Desktop: Projects' covers have different heights and it look not very good. Different sizes of images?

Mobile: The same but projects are listed vertical so it's impossible to notice.

Desktop:
Firefox 109.0.1.
Chrome 110.0.5481.78.

Mobile:
Mozilla/5.0 (Linux; Android 11; SAMSUNG SM-G973U) AppleWebKit/537.36 (KHTML, like Gecko) SamsungBrowser/14.2 Chrome/87.0.4280.141 Mobile Safari/537.36

[noisy]

In general, it would be good to adjust the styles so an image would be adjust to desired ratio. object-fit: cover comes to my mind: https://www.w3schools.com/css/css3_object-fit.asp

Probably it could be used to fix this. Then, perfect image ratio would not be required.

But if there is a better solution (for example bootstrap based, go for it!)