JSFiddle - React, Tailwind, and code Playground
HTML
<div id="bodyContainer">
<div id="header">
<div id="header1"><h1>Welcome</h1></div><div id="header2"><h1>You Get to choose better !! </h1></div>
</div>
<div id="content">
<div id="contentHeader">
<p>You Select ... We Serve </p>
</div>
<div id="nav">
<ul id="navmenu">
<li><a href="#">Home</a></li>
<li><a href="#">Electronics</a></li>
<li><a href="#">Fashions</a></li>
</ul>
</div>
</div>
<div id="sidebar">
</div>
<div id="footer">
<p>WebApp Version Numbered v1.0. All rights Reserved. </p>
</div>
</div>
CSS
*{
margin:0px;
padding:0px;
}
<!--Resetter rules for browsers-->
#bodyContainer {
border:green 2px solid;
}
body {
border:black 2px solid;
background-color : grey;
padding:5px;
}
#header {
background-color : red;
width:70%;
height:80px;
border:black 2px solid;
}
#header1 {
display:inline-block;
width:50%;
vertical-align: top;
}
#header2 {
display:inline-block;
width:50%;
vertical-align: top;
}