JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<div class="wrapper">
    <nav class="nav" role="navigation">
        <li class="nav-item">Members</li>
        <li class="nav-item">Events</li>
    </nav>
    <div class="content-main">
        Main content
    </div>
</div>
</body>

CSS

body {
    -mox-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.wrapper {
    margin: 0 auto;
    font-size:0;
}

.nav {
    position: relative;
    display: inline-block;
    width: 100%;
    background: #34495e;
}

.nav-item {
    font-size:14px;
    float: left;
    /* display: inline-block; */
    padding: 1em;
    color: #fff;
    text-decoration: none;
}

.content-main {
    font-size:14px;
    padding: 1em;
    background: #cf6;
}