JSFiddle - React, Tailwind, and code Playground

HTML

<div id=wrap>
  <div id=inside>
    Content verticaly , content     Content verticaly .

  </div> 
</div>

CSS

#wrap {
    z-index: 999999;
   
    height: 100vh;
    text-align: center;

   
    display: table;
}

/* Solution part II. */
#inside {
    width: 100%;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
}