<div class="container">
  <div class="row row--red">
    <div class="content">
      1
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    </div>
  </div>
  <div class="row row--blue">
    <div class="content">
       2
      <br>
      <br>
      <br>
      <br>
      <br>
    </div>
  </div>
</div>

.container {
  display: flex;
}

.row {
  flex: 1 0 auto;
  font-size: 32px;
  color: #fff;
}

.row--red {
  background-color: red;
  position: relative;
  overflow: hidden auto;
}

.row--red > .content {
  position: absolute;
  width: 100%;
}
.row--blue {
  background-color: blue;
}

.content {
  background-color: rgba(155, 155, 155, .6);
}