JSFiddle - React, Tailwind, and code Playground

by Fredy Sudhir

HTML

<div id="headerwrapper">
<div class="header">
<img src="images/headerlogo.png" alt="Digital Billboard Guru" />
<h1>Call Now For Your<br />FREE Consultation<br />(000)000-0000</h1>
</div>
</div>

<div id="bodywrapper">
<section>
<p>Test</p>
</section>
<aside>
<p>Test</p>
</aside>
</div>

CSS

#headerwrapper {
  width:80%;
  height:auto;
  margin-top:.5em;
  margin-right:auto;
  margin-bottom:0;
  margin-left:auto;
  background:#FFFFFF;
  border-top-left-radius:.625em;
  border-top-right-radius:.625em;
  border:1px #000000 solid;}

.header {
  width:100%;
  height:10em;
  margin:0;
  border-bottom:3px #4E5E78 solid;}

img {
  float:left;
  margin-top:1.5em;
  margin-right:1em;
  margin-bottom:1.4em;
  margin-left:1em;}

#bodywrapper {
  width:80%;
  height:auto;
  margin-top:0em;
  margin-right:auto;
  margin-bottom:2em;
  margin-left:auto;
  background:#FFFFFF;
  border-bottom-left-radius:.625em;
  border-bottom-right-radius:.625em;
  border:1px #000000 solid;
overflow:auto;}

section {
  width:60%;
  float:left;
  margin:auto;}

aside {
  width:40%;
  float:right;
  margin:auto;}