JSFiddle - React, Tailwind, and code Playground

HTML

<div id="contentContainer">
    <div id="chooseStateAlabama">AL</div>
</div>

CSS

#contentContainer {
    width: 100%;
    height: 100%;
    top: 0;
    position: absolute;
    left: 60px;
    bottom: 30px;
    z-index: -9999;
    background-size:100% 100%;
}
#chooseStateAlabama {
    width: 20%;
    height: 25%;
    top: 0;
    left: 0;
    position: absolute;
    background:#FF0004;
    background-size: 100% 200%;
    float: left;
    color: #FFFFFF;
    font-family: Arial;
    font-style: normal;
    font-weight: bold;
    font-size: 50%;
    line-height: 25%;
    text-align: center;
    vertical-align: middle;
}
#chooseStateAlabama:before {
    content:'';
    display:inline-block;
    height:100%;
    vertical-align:middle;
}