JSFiddle - React, Tailwind, and code Playground

HTML

<div>
	<div id="div_1">LEFT COL STATIC WIDTH 300px</div>
	<div id="div_2">CENTER COL DYNAMIC WIDTH</div>
	<div id="div_3">RIGHT COL STATIC WIDTH 350px</div>
</div>

CSS

#div_1 {
		float: left;
		background: red;
		display: inline-block;
		width: 300px;
		height: 50px;
		text-align: left;}
	#div_2 {
		overflow: hidden;
		background: green;
		display: inline-block;
		height: 50px;
		text-align: center;
	}
	#div_3 {
		float: right;
		display: inline-block;
		background: blue;
		width: 350px;
		text-decoration: underline;
		font-weight: bold;
		color: white;
		height: 50px;
		text-align: right;
	}