JSFiddle - React, Tailwind, and code Playground

HTML

<div id="right">
    <div class="heading">Browse Albums By</div>
    <div class="char">
        <ul>
            <li class="left"><a href="a-list.html">A</a></li>
            <li class="left"><a href="b-list.html">B</a></li>
            <li class="left"><a href="c-list.html">C</a></li>
            <li class="left"><a href="d-list.html">D</a></li>
            <li class="left"><a href="e-list.html">E</a></li>
            <li class="left"><a href="f-list.html">F</a></li>
            <li class="left"><a href="g-list.html">G</a></li>
            <li class="left"><a href="h-list.html">H</a></li>
            <li class="left"><a href="i-list.html">I</a></li>
            <li class="left"><a href="j-list.html">J</a></li>
            <li class="left"><a href="k-list.html">K</a></li>
            <li class="left"><a href="l-list.html">L</a></li>
            <li class="left"><a href="m-list.html">M</a></li>
            <li class="left"><a href="n-list.html">N</a></li>
            <li class="left"><a href="o-list.html">O</a></li>
            <li class="left"><a href="p-list.html">P</a></li>
            <li class="left"><a href="q-list.html">Q</a></li>
            <li class="left"><a href="r-list.html">R</a></li>
            <li class="left"><a href="s-list.html">S</a></li>
            <li class="left"><a href="t-list.html">T</a></li>
            <li class="left"><a href="u-list.html">U</a></li>
            <li class="left"><a href="v-list.html">V</a></li>
            <li class="left"><a href="w-list.html">W</a></li>
            <li class="left"><a href="x-list.html">X</a></li>
            <li class="left"><a href="y-list.html">Y</a></li>
            <li class="left"><a href="z-list.html">Z</a></li>
            <li class="left"><a href="num-list.html">#</a></li>
        </ul>
    </div>
    <div style="clear:left;"></div>
    <div class="heading">Latest Tags</div>
</div>

CSS

#right{ 
    float: right;
    border: 1px solid #85004B;
    width:182px;
}
#right .heading{
    font-size: 9pt;
    font-weight:bold;
    padding:2px 0px 2px 3px;
    text-align:center;
    background:#85004B;
    color:#fff;
}
#right .char{
    background:#C9F;
    width:182px;
}
#right .char ul, li{
    list-style-type:none;
}
#right .char li{
    width:15px;
    display:inline;
    font-size:11pt;
    font-weight:700;
    margin:0px 1px 1px 0px;
    background-color:#C9F;
    text-align:center;
    overflow:hidden;
}
#right .left{
    float:left;
}

JavaScript

h