JSFiddle - React, Tailwind, and code Playground

by ZenMaster

HTML

<div id="header">
    <h2><a href="#">Header</a></h2>
    <p>Lorem ipsum...</p>
</div>

<div id="sidebar">
    <h2><a href="#">Sidebar</a></h2>
    <p>Lorem ipsum...</p>
</div>

<div id="main">
    <h2><a href="#">Main</a></h2>
    <p>Lorem ipsum...</p>
</div>

<div id="footer">
    <h2><a href="#">Footer</a></h2>
    <p>Lorem ipsum...</p>
</div>

CSS

html {
  background: #9c9965;
}

body {
  width: 80%;
  margin: 20px auto;
  background: #ffe3a6;
}

#header {
  background: #9c9965;
}

#sidebar {
  float: left;
  width: 200px;
  background: #d4c37b;
}

#main {
  border-left: 200px solid #d4c37b;
}

#footer {
  clear: left;
  background: #9c9965;
}