JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <div class="resize">
    <div>1</div>
    <div>2</div>
    <div>3</div>
  </div>
</div>

CSS

body {
  position: absolute;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.container {
  flex: 1;
  border: 2px solid blue;
}
.resize {
  display: inline-flex;
  height: auto;
  /* flex-direction: column; */
  flex-wrap: wrap;
  border: 2px solid #f00;
}

.resize > div {
  border: 2px solid #555;
  flex: 0 0 auto;
  background-color: #ccc;
  height: 100px;
  width: 100px;
}