JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Page Title</title>
    <link type="text/css" rel="stylesheet" href="style.css">
</head>
<body>
    <header>
        header
    </header>
    <section>
       <article>
           <h1>Article Title</h1>
           <p> Ut enim ad minim veniam, quis nostrud exercitation consectetur adipisicing elit. Velit esse cillum dolore ullamco laboris nisi in reprehenderit in voluptate. Mollit anim id est laborum. Sunt in culpa duis aute irure dolor excepteur sint occaecat. Ut enim ad minim</p>
            <p>veniam, quis nostrud exercitation consectetur adipisicing elit. Velit esse cillum dolore ullamco laboris nisi in reprehenderit in voluptate. Mollit anim id est laborum. Sunt in culpa duis aute irure dolor excepteur sint occaecat.
         </p>
       </article>
    </section>
           <aside>
        <nav>
           <!-- navigation? -->
        </nav>
         <ul>
             <li><a href="#">Menu</a></li>
             <li><a href="#">Menu</a></li>
             <li><a href="#">Menu</a></li>
             <li><a href="#">Menu</a></li>
             <li><a href="#">Menu</a></li>            
        </ul>
       </aside>
    <footer>
         <div id="left-align">
             Copyright
        </div><!-- #left-align -->
        <div id="right-align">
            Navigation
        </div><!-- #right-align -->
    </footer>
</body>
</html>

CSS

/* Global Styles */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit;}

table {border-collapse: collapse; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
form legend {display: none;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
ol, ul {list-style: none;}
hr {display: none; visibility: hidden;}

:focus {outline: 0;}

/* Content */

header {
    height:150px;
    background: #9F111B;
}
aside nav {
    margin: 10px;
}
nav {
    height: 20px;
    background-color:white;
    border:1px solid grey;

    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
}
section {
    width: 100%;
    margin-left: 200px;
}
article {
    float:right;
}
aside {
    width: 200px;
    float:left;
}
footer {
    clear:both;
    height:150px;
    background: #9F111B;
}
footer #left-align {
    float:left;
}
footer #right-align {
    float:right;
}