How to make all images of different height and width the same via CSS?

Spread the love

Sometimes, we want to make all images of different height and width the same via CSS.

In this article, we’ll look at how to make all images of different height and width the same via CSS.

How to make all images of different height and width the same via CSS?

To make all images of different height and width the same via CSS, we set the width and height of img elements.

For instance, we write

<img src="https://picsum.photos/200/300" />
<img src="http://i.imgur.com/37w80TG.jpg" />
<img src="https://picsum.photos/100/200" />

to add 3 img elements.

Then we write

img {
  width: 100px;
  height: 100px;
  object-fit: cover;
}

to set the width and height of all img elements.

Conclusion

To make all images of different height and width the same via CSS, we set the width and height of img elements.

Leave a Reply

Your email address will not be published. Required fields are marked *