JSFiddle - React, Tailwind, and code Playground

HTML

<div class="flex-container">

  <div class="flex-boxes">
    A
  </div>
  
  <div class="flex-boxes">
    <img class="cat" src="http://www.publicdomainpictures.net/pictures/30000/velka/annoyed-cat.jpg" />
  </div>
  
   <div class="flex-boxes">
    C
  </div>


</div>

CSS

.flex-container {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
}

.flex-boxes {
  /* flex-grow: 1; */
  flex: 0 0 33.33%; /* NEW */
  border: 2px solid red;
}

.cat {
  width: auto;
  
}