JSFiddle - React, Tailwind, and code Playground
HTML
<div class="grid3x3">
<div><img src="http://placekitten.com/200/300"></div>
<div><img src="http://placekitten.com/240/300"></div>
<div><img src="http://placekitten.com/400/300"></div>
<div><img src="http://placekitten.com/280/300"></div>
<div><img src="http://placekitten.com/210/140"></div>
<div><img src="http://placekitten.com/240/200"></div>
<div><img src="http://placekitten.com/100/300"></div>
<div><img src="http://placekitten.com/200/100"></div>
<div><img src="http://placekitten.com/700/300"></div>
</div>
CSS
.grid3x3{
width:300px;
height:300px;
clear:both;
}
.grid3x3>div{
width:100px;
height:100px;
float:left;
line-height:100px;
text-align:center;
}
.grid3x3>div>img{
display:inline-block;
vertical-align:middle;
max-width:80%;
max-height:80%;
}