How Can CSS Make All Images Fit a 100x100 Pixel Square?

Achieving Uniformity Among Images of Varying Dimensions

Envision building an image wall adorned with product photographs. The challenge arises when these images come in a myriad of sizes. How can one utilize CSS to bestow upon them a harmonious appearance, with each image adorning a 100 x 100 pixel canvas?

Consider envisioning a div adorned with the desired dimensions of 100 pixels for both height and width. The question remains: how can this div be adeptly utilized to accommodate images of varying proportions?

Current Solution (Optimal for Modern Browsers)

<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">float: left;
width:  100px;
height: 100px;
object-fit: cover;

<img src="http://i.imgur.com/37w80TG.jpg"><br><img src="http://i.imgur.com/B1MCOtx.jpg">