JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header">Hello!</div>
<div id="ruler"></div>
<div id="left">Left</div>
<div id="right">Right</div>
<div id="center">Center</div>

CSS

#header {
 text-align: center;   
}
#ruler {
 border-bottom: 1px solid #000;   
}
#left {
 float: left;  
 width: 100px;
 background-color: #eee;  
}
#right {
 float: right; 
 width: 100px;
 background-color: #eee;  
}
#center {
 margin: 0 auto;
 width: 250px;
 overflow: hidden;   
 background-color: #ccc;
}