JSFiddle - React, Tailwind, and code Playground

HTML

<img src="http://i.stack.imgur.com/8yNbR.png" style="float: right;" />
<a class="big"></a>
<a class="small"></a>

CSS

a {
    display: block;
    background-image: url('http://i.stack.imgur.com/8yNbR.png');
    background-size: 100%;
    background-position: 0 0;
    background-repeat: no-repeat;
}
a:hover {
    background-position: 0 50%;
}
a:active {
    background-position: 0 100%;
}
a.big {
    width: 150px;
    height: 90px;
}
a.small {
    width: 75px;
    height: 45px;
}