How to make an image width 100% of the parent div, but not bigger than its own width with CSS?

Spread the love

Sometimes, we want to make an image width 100% of the parent div, but not bigger than its own width with CSS.

In this article, we’ll look at how to make an image width 100% of the parent div, but not bigger than its own width with CSS.

How to make an image width 100% of the parent div, but not bigger than its own width with CSS?

To make an image width 100% of the parent div, but not bigger than its own width with CSS, we set the max-width of the image.

For instance, we write

img {
  max-width: 100%;
}

to set the max width of the img element to 100% to make it fit its parent div.

Conclusion

To make an image width 100% of the parent div, but not bigger than its own width with CSS, we set the max-width of the image.

Leave a Reply

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