JSFiddle - React, Tailwind, and code Playground

by userdude

HTML

<div id="thumbnailwrapper">
<div id="artiststhumbnail">
    <a href="#">
        <!--image here-->
        <img src="http://goo.gl/QrKCc" height="100%" alt="artist" border="1" />
    </a>
</div>
</div>

CSS

#thumbnailwrapper {
    color:#2A2A2A;margin-right:5px;
    border-radius:0.2em; 
    margin-bottom:5px;
    background-color:#E9F7FE;
    padding:5px; 
    border-color:#DADADA; 
    border-style:solid;  
    border-width:thin; 
    font-size:15px
    text-align: center;
}
#thumbnailwrapper:hover{box-shadow:0 0 5px 5px #DDDDDD}
#artiststhumbnail {
    width:120px; 
    height:108px;
    overflow:hidden;
    border-color:#DADADA;     
    border-style:solid; 
    border-width:thin; 
    background-color:white; 
}
#artiststhumbnail:hover {left:50px }
#genre {
    font-size:12px; 
    font-weight:bold;
    color:#2A2A2A
}