JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="css/style.css" />
        <link rel="stylesheet" href="css/normalize.css" />

    </head>
    <body> 
    <div class="main">

        <div class="floater3">
        </div>
        
        <div class="content3" >
             text
        </div>
        
    </div>

    </body>
</html>

CSS

html, body    {height:100%; margin:0; padding:0;}

html        {font-size:0.8em;}

.main        {width:100%; background-color:#00CCCC; height:100%; position:relative;}

.floater3    {float:left; height:50%; margin-bottom:-120px; width:100%;background-color:#DDD;}

.content3    {clear:both; height:240px; z-index:32; position:relative;margin: 0 auto; width: 600px;background-color:#fff; }