JSFiddle - React, Tailwind, and code Playground

HTML

<body>
	<div class="container">
		<div class="left"><br><br><br><br><br>testsaSas<br><br><br></div>
		<div class="center"></div>
		<div class="right">
			<div class="right-top"></div>
			<div class="right-body"></div>
			<div class="right-bot"></div>
		</div>
	</div>
</body>

CSS

.container{
	position: relative;
	display: table;
}
.left, .center, .right{
    width: 100px;
	display:table-cell;
}
.left, .center{
    border:1px solid #ccc;
}
.right-top, .right-bot{
    height:20px;
    width: 20px;
}
.right-top, .right-bot, .right-body{
	position:absolute;
}
.right-body{
    width: 20px;
    background:black;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
	top: 20px;
	bottom: 20px;
}
.right-top{
    background:#acf;
	top: 0;
}
.right-bot{
    background:#afc;
    bottom: 0;
}