noisy / portfolio

Source code of my portfolio & blog
https://krzysztofszumny.com
3 stars 1 forks source link

Different heights of projects cover #27

Open lukmarcus opened 1 year ago

lukmarcus commented 1 year ago

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.

obraz

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 commented 1 year ago

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!)