JSFiddle - React, Tailwind, and code Playground

HTML

<div class="metaboxdet">
    <div class="metd">
        <h1>Hello World!</h1>
    </div>
</div>

CSS

.metaboxdet {
    height: 100%;
    width: 100%;
    position: absolute;
    right: 0;
    top: 0;
    z-index:9;
    text-align:center;
    margin:0px auto;
    background-color: #292484;
    background-image: linear-gradient(135deg, #292484, #dc4225);
    opacity: 0.6;
}

.metd {position:relative; margin:0px auto; width:70%; }
.metd h1 {color: #FFF; font-size:40px; font-style:italic; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); line-height:1.2em;}