.box img { width: 100%; height: 100%; } .box1 img { object-fit: cover; } .box2 img { object-fit: contain; } .box3 img { object-fit: fill; }
<div class="wrapper"> <div class="box box1"><img src="balloon.jpg" alt="a balloon"></div> <div class="box box2"><img src="balloon.jpg" alt="a balloon"></div> <div class="box box3"><img src="balloon.jpg" alt="a balloon"></div> </div>
