JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<div id="wrap">
   <div id="content">
   This will be centered
   </div>
   <div id="content">
   This will be eefzefzezfe
   </div>
   <div id="content">
   aaaa will be fefefzef
   </div>
</div>
</body>

CSS

#wrap {
    float: left;
    position: relative;
    left: 50%;
}

#content {
    float: left;
    position: relative;
    left: -50%;
    /* -» [Strictly for demo purposes].begin «- */
    background: #def;
    line-height:25px;
    font-size: 20px;
    /* -» [Strictly for demo purposes].end «- */
}