JSFiddle - React, Tailwind, and code Playground
HTML
<div class="thumbnails">
<div class="thumbnail-container">
<img class="thumbnail" src="http://1.34.244.41:50025/sticker?pkg=1&sticker=1"/>
</div>
<div class="thumbnail-container">
<img class="thumbnail" src="http://1.34.244.41:50025/sticker?pkg=1&sticker=2"/>
</div>
<div class="thumbnail-container">
<img class="thumbnail" src="http://1.34.244.41:50025/sticker?pkg=1&sticker=3"/>
</div>
<div class="thumbnail-container">
<img class="thumbnail" src="http://1.34.244.41:50025/sticker?pkg=1&sticker=4"/>
</div>
<div class="thumbnail-container">
<img class="thumbnail" src="http://1.34.244.41:50025/sticker?pkg=1&sticker=5"/>
</div>
<div class="thumbnail-container">
<img class="thumbnail" src="http://1.34.244.41:50025/sticker?pkg=1&sticker=6"/>
</div>
<div class="thumbnail-container">
<img class="thumbnail" src="http://1.34.244.41:50025/sticker?pkg=1&sticker=7"/>
</div>
<div class="thumbnail-container">
<img class="thumbnail" src="http://1.34.244.41:50025/sticker?pkg=1&sticker=8"/>
</div>
<div class="thumbnail-container">
<img class="thumbnail" src="http://1.34.244.41:50025/sticker?pkg=1&sticker=9"/>
</div>
<div class="thumbnail-container">
<img class="thumbnail" src="http://1.34.244.41:50025/sticker?pkg=1&sticker=10"/>
</div>
</div>
CSS
.thumbnails {
text-align: center;
}
.thumbnail-container {
display: inline-block;
padding: 2px;
margin: 1px 3px;
width: 90px;
height: 90px;
border: 1px solid;
border-color: #DDD #000 #000 #DDD ;
overflow: hidden;
}
.thumbnail {
max-width: 90px;
max-height: 90px;
position: relative;
}