JSFiddle - React, Tailwind, and code Playground
HTML
<div class="imageTable">
<table>
<tbody>
<tr>
<td>
<div class="imageContainer">
<img class="autoResizeTableImage" src="http://i.imgur.com/8AaaAEh.png" />
</div>
</td>
<td>
<div class="imageContainer">
<img class="autoResizeTableImage" src="http://i.imgur.com/mTDgA9G.png" />
</div>
</td>
<td>
<div class="imageContainer">
<img class="autoResizeTableImage" src="http://i.imgur.com/h7grKlh.png" />
</div>
</td>
</tr>
<tr>
<td>
<div class="imageContainer">
<img class="autoResizeTableImage" src="http://i.imgur.com/kNV9Mwp.png" />
</div>
</td>
<td>
<div class="imageContainer">
<img class="autoResizeTableImage" src="http://i.imgur.com/TY9sgnz.png" />
</div>
</td>
<td>
<div class="imageContainer">
<img class="autoResizeTableImage" src="http://i.imgur.com/jp2ub2G.png" />
</div>
</td>
</tr>
<tr>
<td>
<div class="imageContainer">
<img class="autoResizeTableImage" src="http://i.imgur.com/Js3GVdj.png" />
</div>
</td>
<td>
<div class="imageContainer">
<img class="autoResizeTableImage" src="http://i.imgur.com/l9DH7Vf.png" />
</div>
</td>
<td>
<div class="imageContainer">
<img...
CSS
.autoResizeTableImage {
max-width: 100%;
height: auto;
}
table, th, td {
border: 1px solid black;
}
imageContainer {
display: table-cell;
width:100%;
}
td { width: 100; }