JSFiddle - React, Tailwind, and code Playground

HTML

<div class="block">
<div class="a">Левый блок</div>
<div class="b"> Нахоится в середине и занимает все 100%</div>
<div class="c">Правый блок</div>
</div>

CSS

.a,.b,.c{
  height: 400px;
}

.a {
  background: green;
    flex-basis: auto;
    min-height: 100px;
    width: 152px;
}

.b {
  background: gold;
  flex-basis: calc(100% - 282px);
  min-height: 100px;
} 

.c {
  background: red;
  align-self: center;
  flex-basis: auto;
  width: 130px;
}

.block {
    align-items: stretch;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 5px;
    position: relative;
}