JSFiddle - React, Tailwind, and code Playground

HTML

<div class = 'father'>
  <div class="left">左</div>
   <div class="center">中</div>
  <div class="right">右</div>
</div>

CSS

html,body{margin:0; padding: 0;}
.father{ display:flex}
.left,.right,.center { height: 200px; line-height:200px; text-align:center; }

.left {float:left; width: 200px; background-color: #FAD7F0;}
.right {float:right; width: 200px; background-color: #FAD7F0;}
.center {  background-color: #C7DAFC; flex:1;min-width:100px}