JSFiddle - React, Tailwind, and code Playground

HTML

<div id="slideClick">
    <div style="padding: 0; margin: 0 auto; text-align: center;">
        <span class="sideMsg">MESSAGES</span>
    </div>
</div>

CSS

.sideMsg
{
      color: #333;
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
white-space: nowrap;
display: inline-block;
bottom: 0;
font-family: ‘Trebuchet MS’, Helvetica, sans-serif;
font-size: 14px;
font-weight: normal;
text-shadow: 0px 0px 1px #333;
text-align: center;

line-height: 40px;
}
#slideClick {
    margin-top:30px;
    float: left;
height: 40px;
width: 90px;
background: #EE8D40;
-webkit-border-top-left-radius: 0;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomleft: 10px;
border-top-left-radius: 0;
border-bottom-right-radius: 10px;
cursor: pointer;
text-align: center;
-webkit-transform: rotate(90deg);
}