JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div class="flex-wrapper">
  <div class="flex-wrapper-inner">
    <div class="header">
      <h4>Box 1</h4>
      <h4>Box 2</h4>
      <h4>Box 3</h4>
    </div>
    <div class="column-wrapper">
      <div class="column">
        <div class="box-results list-group">
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item" href="#">Quisque coeptis possedit radiis. Ardentior et contraria et quinta feras</a>
          <a class="list-group-item"...

CSS

body {
  display: flex; /* IE11 fix */
}

.flex-wrapper {
  display: flex;
  margin: 20px auto;
  width: 1184px;
  max-height: 80vh;
  border: 2px solid red;
  smin-height: 150px;
  flex-shrink: 0; /* override default `flex-shrink: 1` */
}

.flex-wrapper .flex-wrapper-inner {
  display: flex;
  width: 100%;
  flex-direction: column;
}

.flex-wrapper .flex-wrapper-inner .header {
  display: flex;
  flex-shrink: 0;
  width: 100%;
}

.flex-wrapper .flex-wrapper-inner .header H4 {
  flex: 1;
}

.flex-wrapper .flex-wrapper-inner .column-wrapper {
  flex-grow: 1;
  display: flex;
  overflow: hidden;; /* IE11 & Firefox fix */
}

.flex-wrapper .flex-wrapper-inner .column {
  flex: 1;
  overflow-y: auto;
}

.flex-wrapper .flex-wrapper-inner .column H4 {
  text-align: center;
}

.box-results-users .list-group-item {
  margin: 0;
}

.box-results-users .list-group-item IMG {
  height: 60px;
  width: 60px;
}

.box-results {
  position: relative;
}