JSFiddle - React, Tailwind, and code Playground

by dwayneFiddle

HTML

<div class="container">
	<table border="0">
		<tr>
			<th width="20%">Image Width</th>
			<th width="20%">Image Height</th>
			<th width="20%">Location</th>
			<th width="20%">Internal Notes</th>
			<th width="20%">External Notes</th>
		</tr>
		<tr>
			<td>10.5"</td>
			<td>12.75"</td>
			<td>Left Hip</td>
			<td>Heat Transfer - 49/51</td>
			<td>Fine details in artwork will diminish.</td>
		</tr>                             
		<tr>
			<td></td>
			<td colspan="2"><img src="https://i.postimg.cc/Tw4H40yY/thumbnail-27d67c5eb4-221900-blackhemtag-flat-221900.jpg"></td>
			<td colspan="2"><img src="https://i.postimg.cc/VLRHyz0V/thumbnail-32136cc21e-221900-blackhemtag-thumb-221900.jpg"></td>
		</tr>                                        
	</table>
</div>

CSS

.container { overflow:auto;height:800px; }
.container img { transition: all 1s; box-shadow: -3px 1px 5px rgba(0,0,0,.5); }
div.container table { margin-top: 85px; }
div.container table th { text-align:center; }
div.container table td:first-child { text-align:center; }
div.container table td:first-child + td { text-align:center; }
div.container table tr:first-child + tr { text-align:center; }
div.container table tr:first-child + tr td { padding:10px; }
div.container table td img { width:40%; }        
div.container img:hover { transform: scale(3.0) rotate(-10deg) }