JSFiddle - React, Tailwind, and code Playground

HTML

<div class="bluebox"><h2>Hi i am a text, now I am only horizontal centered<h2></div>

CSS

.bluebox
{
width: 400px;
background-color: blue;
height: 200px;
}

.bluebox h2
{
font-family: Arial;    
font-size: 10pt;  
text-align: center;
padding-top: 90px;
}