<div class="wrap">
  <div contenteditable="true" class="box">
    <div class="row"> ThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneeded
    </div>
    <div class="row"> ThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneeded
    </div>
    <div class="row"> ThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneeded
      Test<br>Test<br>Test
      Test
    </div>
  </div>
  <div contenteditable="true" class="box">
    <div class="row"> ThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneeded
    </div>
    <div class="row">
      ThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneeded
    </div>
    <div class="row">
      ThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneededThisisadivthatwillscrollwhenneeded
      Test
      Test
    </div>
  </div>
</div>

/* lets add box sizing border-box  to make things easier.*/
html {
  box-sizing: border-box;
}
*,
*:before,
*:after {
  box-sizing: inherit;
}
html,
body {
  padding: 0;
  margin: 0;
}
.wrap {
  display: flex;
  min-width: 0;
}

.box {
  flex: 1 0 50%;
  width: 50%;
  padding: 10px;
  overflow-wrap: normal;
  min-width: 0;
}
.row {
  width: 100%;
  overflow: auto;
  padding: 10px;
  border: 1px solid #000;
}