JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper">
<div id="header">
    <div class="headerDiv">
        1
    </div>
    <div class="headerDiv">
        2
    </div>
    <div class="headerDiv">
        3
    </div>
</div>
<div id="nav">
    links
</div>
<div id="content">
    content
</div>
<div id="footer">
    footer
</div>
</div>

CSS

#wrapper {
  width: 95%;
  margin: 20px auto;
  border: 1px solid #000;
  float: left;
}

.headerDiv {
  float: left;
  width: 33%;
  border: 1px solid #000;
  text-align: center;
}

#header {
  padding: 5px;
}

#content, #nav, #footer {
  margin: 5px;
  width: 97%;
  float: left;
  border: 1px solid #000;
}