Shivam Mitra Shivam Mitra - 1 month ago 14
CSS Question

Fitting an image to a div container in HTML

I would like an image to fit into a div container. It should fit even if the image is smaller than div or image is larger than div. I have tried some options like setting max-width and height to 100% but it doesn't work.



#content {
width: 351px;
height: 250px;
border: 1px solid black;
}
#content img {
max-width: 100%;
max-height: 100%;
}

<div id="content">
<img src="https://dumkhum.com/wp-content/uploads/2016/10/SHIVAAY_ISHQAA_1.jpg">
</div>





Here is my code link:https://jsfiddle.net/w8r0g921/

Answer
#content {
  width:351px;
  height:250px;
  border:1px solid black;
}
#content img {
  width:100%;
  height:100%;
}
Comments