JSFiddle - React, Tailwind, and code Playground

HTML

<header>
        <div id="banner">
            <a href="/index">
                <img src="/_images/layout/PentaOneStop_headerLogo.png" class="img-center" />
            </a>
        </div>
    </header>

CSS

header{
  position: relative;
  width: 100%;
  height: 65px;
  background-color: #662D91;
}
#banner{
  position: absolute;
  left: 50%;
  margin-left: -240px;
  width: 480px;
  height: 115px;
  border-radius: 20px;
  text-align: center;
}