JSFiddle - React, Tailwind, and code Playground

by Sinthujan Pakkiyarajah

HTML

<div><br></br>
    <nav className="navbar navbar-default">
      <div className="container">
        <div className="navbar-header">
          <br/>
            <div>
              <div id="menu-header" className="col-xs-10 col-xs-offset-1"><h4>&emsp;Cocktails</h4></div>
            </div>
        </div>
      </div>
    </nav>
    </div>

CSS

#menu-header{
  background-color:#009376;
  padding-top:3px;
  padding-right:3px;
  padding-bottom:2px;
  padding-left:3px;
  width: 900px;
  display: flex;
  align-self: center;
  position: absolute;
  top: calc( 50vh - 66px );
}