JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#">
    <div id="logo">
        <span>logo</span>
    </div>
</a>

CSS

a, #logo {
    background: url('http://i.stack.imgur.com/w5ZnN.png') 0 -23px;
    width: 20px;
    height: 23px;
    display: block;
}

#logo {
    background-position: 0 0;
    -webkit-transition: opacity .5s linear;
       -moz-transition: opacity .5s linear;
            transition: opacity .5s linear;
}

#logo:hover {
    opacity: 0;
}

#logo span {
    margin-left:-3000px;
}