How to make child div scrollable when it exceeds parent height?

Because this post is still ranking very high in Google, I’d like to post a better solution using flexbox. Actually this is very simple.
Use display: flex, flex-direction: column and overflow: hidden for parent and overflow-y: auto for child.

.wrapper {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.scrollable-child {
  overflow-y: auto;
}

Here’s the pen:
https://codepen.io/pawelsas/pen/vdwjpj