JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menuItem_Large" id="node_1_menu">
                    <span>menu item 1</span>
</div>

CSS

.menuItem_Large
{
    position: absolute;
    left: 0px;
    display: inline-block;
    padding-left: 6px;
    padding-right: 6px;
    height: 20px;
    line-height: 16px;
    vertical-align: middle;
    background-image : url('http://i58.tinypic.com/21eyrk8.png');
    background-repeat: repeat;
    cursor:pointer;
}

    .menuItem_Large:before
    {
        content:"";
        position:absolute;
        top:0px;
        left:0px;
        width:0%;
        height:20px;
        background-color:rgba(0,200,255,1);
        transition:width 0.3s ease-out;
    }

    .menuItem_Large:hover:before
    {
        width:100%;
    }

    .menuItem_Large span
    {
        color: white;
        font-size: 16px;
    }