CSS Tutorial 38 - object fit property
In this CSS tutorial I go over the object-fit property. With the object-fit property, you can specify how an image or video is resized to fit its container.
By default, the object-fit property is set to fill, which means the image will be stretched or squished to fit.
By setting object-fit property to contain, it will maintain the aspect ratio, thus shrinking the image size as per the container.
By setting object-fit property to none, it will not shrink down the image to fit container. Only what can fit in container will get shown, rest will be trimmed.
By setting object-fit property to cover, it will maintain the aspect ratio and will be clipped if necessary.