JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
      <div class="flexbox">
        <div class="column">This is the left column!</div>
        <div class="middleColumn">
                <img src="http://placehold.it/400/333333" />
        </div>
        <div class="column">This is the right column!</div>
      </div>
    </div>

CSS

.container {
  width:300px;
}
.flexbox {
  display:flex;
}

.flexbox .column {
  flex:2;
  background-color: red;
}

.flexbox .middleColumn {
  flex:3;
}

.flexbox .middleColumn img {
    width: 100%;
    height: 100%;
    display: block;
}