JSFiddle - React, Tailwind, and code Playground

HTML

<div class="grid">
      <div class="header">Some header stuff
      </div>
      <div class="grid__row">
        <div class="grid__item">1 is a number</div>
        <img id="pic" src="http://lorempixel.com/1200/800/">
      </div>
    </div>

CSS

.grid {
  border: solid 1px #e7e7e7;
  height:95vh;
  display: flex;
  flex-direction: column;
}

.header {
  flex: 0;
}

.grid__row {
  flex: 1;
  display: flex;
  flex-direction:row;
}

.grid__item {
  white-space:nowrap;
  padding: 12px;
  border: solid 1px #e7e7e7;
}

img {
  object-fit:contain;
  border: solid 1px #e7e7e7;
  max-width:75%;
}