JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<table>
    <tbody>
        <tr>
        <td colspan="3" class="tableBannerList" id="site_41">

        <div class="loadedFile">
             <a target="_blank" href="#"><img src="http://placehold.it/100x100"></a>
                <span class="delBanner">500*375</span>
        </div>

        <div class="loadedFile">
                <a target="_blank" href="#"><img src="http://placehold.it/100x100"></a>
                <span class="delBanner">1935*1375</span>
        </div>
        
        </td>
</tr>
</tbody>
</table>
</body>
</html>

CSS

.tableBannerList {padding: 5px; text-align: center;}

.loadedFile {
    width: 100px;
    height: 100px; 
    display: inline-block; 
    overflow: hidden; 
    border-radius: 5px; 
    border: 1px solid #BFCED6; 
    margin-left: 5px; 
    position: relative; 
    top: 0; 
    bottom: 0;
}

.loadedFile img {
    width: 100%; 
    border-radius: 5px; 
    padding: 0 !important;
}

.loadedFile .delBanner { 
    position: absolute; 
    bottom: 0; 
    width: 98px; 
    left: 1px; 
    background: #FFF; 
    text-align: center; 
    padding-top: 2px; 
    border-radius: 5px; 
}