JSFiddle - React, Tailwind, and code Playground

HTML

<a href="">
<div class="left"></div>
<div class="middle">Heere you text </div>
<div class="right"></div>
</a>

CSS

a{
    display:inline-block;
}

.left, .middle, .right{
    float:left;
    height:100px;
    width:100px;
}

.left{
    background:yellow url(../..) no-repeat ;
}

.middle{
    background:red url(../..) repeat-x;
    width:auto;
    line-height:100px;
}

.right{
    background:green url(../..) no-repeat;
}