Core Code
Core Code Modern Dev Handbook

object-fit Scale Down

scale-down chooses the smaller of none or contain.

Preview

Code

<style>
.box{
width:200px;
height:140px;
background:#eee;
}

img{
width:100%;
height:100%;
object-fit:scale-down;
}
</style>

<div class="box">
<img src="https://via.placeholder.com/400x250">
</div>

More CSS object-fit Examples (8)

example object-fit Cover open example example object-fit Contain open example example object-fit Fill open example example object-fit None open example example Avatar Crop Example open example example Image Gallery Thumbnails open example example object-fit with Video open example example object-fit Hover Zoom open example