JSFiddle - React, Tailwind, and code Playground

by Renilson Meneguci

HTML

<body>

<div id="header">
    <div id="logo">
                <p>Logo</p>
            </div>
            <div id="redes">
                <p>Redes Sociais</p>
            </div>
</div>

<div id="nav">
 <p>
                <a href="/">Home</a>
            </p>
            <p>
                <a href="/contact">Contact</a>
            </p>
</div>

<div id="section">
<h2>Mussum</h2>
    <p>
Mussum ipsum cacilds, vidis litro abertis. Consetis adipiscings elitis. Pra lá , depois divoltis porris, paradis. Paisis, filhis, espiritis santis. Mé faiz elementum girarzis, nisi eros vermeio, in elementis mé pra quem é amistosis quis leo. Manduma pindureta quium dia nois paga. Sapien in monti palavris qui num significa nadis i pareci latim. Interessantiss quisso pudia ce receita de bolis, mais bolis eu num gostis.
    </p>

</div>

<div id="footer">
<p>
                &copy; Copyright  by Pedro Miguel Ferreira Pereira
            </p>
</div>

</body>

CSS

#header {
    background-color:black;
    color:white;
}
#nav {
    line-height:30px;
    background-color:#eeeeee;
    height:300px;
    width:100px;
    float:left;
    padding:5px;	      
}
#section {
    width:350px;
    float:left;
    padding:10px;	 	 
}
#footer {
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
   padding:5px;	 	 
}

 #logo {
display: inline-block; 
     margin-right: 50%;
}
 #redes {
display: inline-block;
     margin-left: 10%;
}