JSFiddle - React, Tailwind, and code Playground

HTML

<header>
    <div height="100"></div>
</header>
<div id="header">
    <ul>
        <li>Home</li>
        <li>About</li>
    </ul>
</div>
<div class="content"></div>

CSS

html, body {
        height:150%;
    }
    body {
        margin: 0;
        padding: 0;
    }
    #header {
        position:fixed;
        width:900px;
        height:100px;
        background-color:#FFF;
        left: 50%;
        margin-left: -450px;
        border-top:1px;
        border-top-color:#D2D2D2;
        border-top-style:solid;
        border-bottom:1px;
        border-bottom-color:#D2D2D2;
        border-bottom-style:solid;
    }
    header {
        background-color:#FFF;
        width:900px;
        margin-left:auto;
        margin-right:auto;
        text-align:center;
    }
    .content {
        width:900px;
        margin-left:auto;
        margin-right:auto;
    }
    #header ul {
        list-style:none;
    }
    #header ul li {
        display:inline;
        padding:10px;
    }