JSFiddle - React, Tailwind, and code Playground

HTML

<main>
    
    <div id="wrapper">
        <header>Header</header>
        <div id="content">
            Innhold her!<br/>
            Innhold her!<br>
            Innhold her!<br>
            Innhold her!<br>
            Innhold her!<br>
            Innhold her!<br>
            Innhold her!<br>
        </div>
    </div>
</main>

CSS

body
{
    margin: 25% auto;
}

main
{
    background-color: aqua;
    height: 200px;
}
main > div#wrapper
{
    outline: 1px solid red;
    width: 500px;
    margin: 0px auto;
    height: 240px;
    top: -40px;
}

header
{
    height: 40px;
    width: 160px;
    background-color: yellow;
    position: relative;
    top: -40px;   
}
div#content
{
    margin-top: -40px;
}