JSFiddle - React, Tailwind, and code Playground

by harsh dand

HTML

<ul id="navsprite">
 <li id="home"><a href="#"></a></li>
 <li id="prev"><a href="#"></a></li>
 <li id="next"><a href="#"></a></li>
</ul>

CSS

body,html,div{
    width:100%;
    height:100%;
}

#navsprite {
    width: 134px;
    position: relative;
    left: 50%;
    top: 50%;
    margin-left: -67px;
    margin-top: -22px;
}
#navsprite li {
    margin: 0;
    padding: 0;
    list-style: none;
    position: absolute;
    top: 0px;
}
#navsprite a {
    height: 44px;
    display: block;
}
#home {
    left: 0px;
    width: 46px;
    height: 44px;
    background: url(http://placekitten.com/g/200/300) 0 0;
}
#prev {
    left: 63px;
    width: 43px;
    height: 44px;
    background:url(http://placekitten.com/g/200/300) -47px 0;
}
#next {
    left: 129px;
    width: 43px;
    height: 44px;
    background:url(http://placekitten.com/g/200/300) -91px 0;
}