CSS force image resize and keep aspect ratio

Question

I am working with images, and I ran across a problem with aspect ratios.

Answer 1

I've struggled with this problem quite hard, and eventually arrived at this simple solution:

object-fit: cover;
width: 100%;
height: 250px;

You can adjust the width and height to fit your needs, and the object-fit property will do the cropping for you.

More information about the possible values for the object-fit property and a compatibility table are available here: https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit

Cheers.