JSFiddle - React, Tailwind, and code Playground
HTML
<section>
<div class='container'>
<div id="a">1</div><!--
--><div id="b">2</div><!--
--><div id="d">4</div>
</div>
<div id="c">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam era.</div>
</section>
CSS
* {
margin:0;
padding:0;
}
section {
width: 100%;
}
.container {
position: absolute;
width: 100%;
}
#a {
padding: 0px;
display: inline-block;
height: 500px;
width: 60px;
background-color: #bbb;
}
#b {
padding: 0px;
display: inline-block;
height: 500px;
width: 16px;
background-color: #ccc;
border-left: 0px none;
}
#c {
padding: 0px;
display: inline-block;
height: 500px;
width: auto;
background-color: #ddd;
margin: 0px 16px 0px 76px;
}
#d {
padding: 0px;
float: right;
height: 500px;
width: 16px;
background-color: #eee;
}