JSFiddle - React, Tailwind, and code Playground

HTML

<div id="main">
 
    <div id="menu">
        <section class="user">
            <h3>Olá Fulano de tal</h3>
        </section>
        <section class="news">
            <h2>Newsletter</h2>
            <input type="text" name="email" placeholder="Insira seu e-mail aqui" /> 
            <input type="button" value="Cadastrar" />
        </section>   
        <nav>
            <ul>
                <li>Link </li>
                <li>Link </li>
                <li>Link </li>
                <li>Link </li>
                <li>Link </li>
                <li>Link </li>
            </ul>   
        </nav>   
    </div>
    
    <div id="conteudo">
        <header> Topo do site</header>
   
        <article>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut quis nisl scelerisque, ultrices dolor et, aliquet erat. Aenean non placerat risus. Quisque sapien libero, feugiat vitae orci eu, convallis accumsan sem. Vivamus massa massa, tincidunt sit amet urna a, ultricies ornare ipsum. Phasellus vitae dignissim est, sodales gravida lectus. Vestibulum faucibus auctor luctus. Nulla quis feugiat dolor, eu elementum enim. Vestibulum ultrices aliquam felis at egestas. Sed elementum nec quam et fermentum. Sed enim nisl, auctor et tempus eget, hendrerit nec sapien.

Vivamus ultrices dolor orci, ut rhoncus nisl pulvinar sit amet. Nunc sit amet eleifend tortor. Integer blandit gravida faucibus. Sed in adipiscing ligula. Quisque posuere est id velit pellentesque commodo. Sed et iaculis mauris, at ultrices est. Fusce fringilla tellus ut leo varius convallis. Suspendisse imperdiet magna lorem, et ultrices metus sodales non. Morbi justo magna, iaculis at dignissim vitae, consectetur quis elit. Quisque eget sodales eros, in feugiat lorem. Fusce varius interdum mi eu consectetur. Duis sit amet hendrerit massa, non sagittis lorem.

Pellentesque tincidunt augue dolor, eu semper felis dapibus non. Nullam blandit ut felis ultricies condimentum. Donec eget dapibus mi, quis...

CSS

@media all {
* {
    margin: 0;
    padding: 0;
}

html, body {
    width: 100%;
    height: 100%;
    min-height: 100%;
    } 
}
#main{ width: 960px; background: green; height: 100%; margin: 0 auto; display: block;}
div#menu{ width: 300px; background: #e9e9e9; height: 800px; position: fixed;}
div#menu nav ul li{ list-style: none;}
div#menu section.user{ width: 100%; background: #f00; height: 100px; margin-bottom: 10px;}
div#menu section.news{ width: 100%; background: #ccc; height: 100px; margin-bottom: 10px;}
div#conteudo{width: 620px; background: #eeeeee; height: 100%; float: right; }
div#conteudo article{ width: 580px; background: blue; height: 100%; margin: 0 auto;}
div#conteudo header{ width: 620px; height: 50px; background: yellow;}