JSFiddle - React, Tailwind, and code Playground
HTML
<div class="container">
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
<img src="" style="width:60px;height:60px;" />
</div>
CSS
img {
float: left;
margin: 0;
}
JavaScript
var IMG_WIDTH = 60;
$(function() {
$(window).resize(function() {
// $('#debug').html($('.container').width());
var width = $('.container').width();
if (width % IMG_WIDTH != 0) {
$('.container img').css({
width: width / Math.floor(width / 60),
height: width / Math.floor(width / 60)
});
}
}).resize();
});