JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
  <div class="left"></div>
  <div class="right"></div>
</div>

CSS

.wrapper {
  display: flex;
  height: 200px;
  width: 300px;
  background: yellow;
  overflow: hidden;
}

.left {
  height: 100%;
  width: 50px;
  background: blue;
}

.right {
  flex: 1;
  background: green;
}