bootstrap 4 - In css setting max-width for small images how to make width NOT bigger its original size?

Question

With scss / bootstrap 4.5 html I set max width for for images with class

max-width: 250px;
height: auto;

It works ok for big images, but if image is small then it is ugly... But if image is small in witdh, if there is a way not to make width bigger its original size?

Thanks!

Answer 1

Wrap the img tag in a div tag and set the max-width for the div tag to be 250px and the max-width for the img tag to be 100%.

<div style="max-width: 250px;">
    <img style="max-width: 100%" src="yourImage.jpg">
</div>