JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
	<title>Yes you CAN</title>
</head>
<body>
<ul>
	<li class='product-type-simple'>
		<a href="/link1">
			<img src="http://placehold.it/150x150">
		</a>
	</li>
	<li class='product-type-simple'>
		<a href="/link2">
			<img src="http://placehold.it/150x150">
		</a>
	</li>
</ul>
</body>
</html>

CSS

ul{
			width: 500px;
			border: 5px solid black; 
		}
		.product-type-simple {
			position: relative;
		  	height: 150px;
		  	width: 150px;
		}
		.product-type-simple:before{
			position: absolute;
			height: 100% ;
			width: 100% ;
			content: '';
			z-index: 999999999999;
		}