JSFiddle - React, Tailwind, and code Playground

by Douglas Crosby

HTML

<div class="s1"><a href="#"></a></div>
<div class="s2"><a href="#"></a></div>
<div class="s3"><a href="#"></a></div>

CSS

div{
    width:300px;
    height:300px;
    overflow:hidden;
    margin:5px;
    border:2px soloid #999;
}
a{
    width:100%;
    height:100%;
    display:block;
}
a:hover{
    background:rgba(255,255,255,.5);
}
.s1{
    background:transparent url("http://placehold.it/500x500") center center no-repeat;
}
.s2{
    background:transparent url("http://placehold.it/700x500") center center no-repeat;
}
.s3{
    background:transparent url("http://placehold.it/500x700") center center no-repeat;
}