JSFiddle - React, Tailwind, and code Playground

HTML

<div id="contenedor">
		<header>
        	<h1>titulo y logo pagina</h1>
        </header>
        <nav id="menu">
        	<ul>
            	<li><a href="#">Enlace</a></li>
            	<li><a href="#">Enlace</a></li>
            	<li><a href="#">Enlace</a></li>
            	<li><a href="#">Enlace</a></li>
            	<li><a href="#">Enlace</a></li>
            </ul>
            
        </nav>
        
        <div id="central">
            <section id="contenido">
                <article>
                	primer articulo<br/>
                	uso display:table-cell para lograr que la altura de esta seccion sea igual al lateral
                </article>
                <article>primer articulo<br/></article>
                <article>2 articulo<br/></article>
                <article>3 articulo<br/></article>
                <article>4 articulo<br/></article>
                <article>5 articulo<br/></article>
                <article>6 articulo<br/></article>
                <article>7 articulo<br/></article>
                <article>8 articulo<br/></article>
                <article>9 articulo<br/></article>
                <article>10 articulo<br/></article>
                <article>11 articulo<br/></article>
                <article>... articulo<br/></article>
                <article>... articulo<br/></article>
                <article>... articulo<br/></article>
                <article> articulo<br/></article>
                <article> articulo<br/></article>
                <article> articulo<br/></article>
                <article> articulo<br/></article>
                <article> articulo<br/></article>
                <article> articulo<br/></article>
                <article> articulo<br/></article>
                <article> articulo<br/></article>
                <article> articulo<br/></article>
                <article> articulo<br/></article>
                <h2>display:table-cell no es soportado por IE7 y anteriores</h2>

        
    
        ...

CSS

* {margin:0; padding:0;  outline: 0;}
a {outline:none; text-decoration:none;}

a img{border:0;}
ul {list-style:none}

#contenedor{
	margin:0 auto;
	width:960px;
	}
header, nav, aside{
	display:block;
	}
header{
	background:#a2a2f7;
	padding:10px;
	}
nav{
	background:#A2E4F7;
	padding:10px;
	}
	
	
#central{
	display:table;
	background:#FF9;
	padding:10px;
	width:100%;
	}	
	
#contenido{
	background:#FDEC76;
	display:table-cell;
	padding:10px;
	width:79%;
	}
#lateral{
	background:#B1B1B4;
	display:table-cell;
	padding:10px;
	width:19%;
	}
footer{
	background:#666;
	padding:10px;
	}
	
	
#menu ul{
	list-style-type: none;
	width:100%;
	}
#menu ul li{
	display:inline-block;
	width:150px;
	}