JSFiddle - React, Tailwind, and code Playground

HTML

<div class="div1"><div class="div2">vertical</div></div>

CSS

.div1
{
height:50px;
background-color: red;
position:relative;    
}
.div2
{
    border: 1px solid;
    background-color: orchid;
    text-decoration: none;
    letter-spacing: 1px;
    text-transform:uppercase;
    padding: 5px;
    position: absolute;
    right:5%;
    top:0%

}

JavaScript

jQuery(document).ready(function(){
var l=jQuery('.div1').height()/2;
var bt=jQuery('.div2').outerHeight()/2;
var val=l-bt;

jQuery('.div2').css("margin-top",val);
});