JSFiddle - React, Tailwind, and code Playground

by Avi Algaly

HTML

<div class="galery-image">
    <div class="image-wrapper">
        <img style="border-radius:3px;" class="img-class" src="http://placehold.it/160x120" />
    </div>
    <div class="outline-wrapper">
        
    </div>
</div>

CSS

.galery-image {
    width:160px;
    height:120px;
    border:solid 0px red;
    position:relative;
    
}
.galery-image .image-wrapper {
    position:absolute;
    top:0;
    left:0;
    z-index:0;
}
.galery-image .outline-wrapper {
    position:absolute;
    width:153px;
    height:112px;
    display:block;
    z-index:10;
}
.galery-image .outline-wrapper:hover {
    border: solid 4px lime;
    border-radius:3px;
}