Div overflow

HTML

<div id="topDiv">
  <div id="insideDiv">
    Some inside content
    <br> More inside content
    <br> More inside content
    <br> More inside content
    <br> More inside content
    <br> More inside content
    <br> More inside content
    <br> More inside content
    <br> More inside content
    <br> More inside content
    <br>
  </div>
  <div id="insideDiv">
    <br>check
    <br>check
    <br>check
    <br>check
    <br>check
    <br>check
    <br>check
    <br>check
  </div>
  <div id="insideDiv">
    <br>check
    <br>check
    <br>check
    <br>check
    <br>check
    <br>check
    <br>check
    <br>check
  </div>
</div>

CSS

html,
body {
  height: 100%;
}

#topDiv {
  background-color: lightblue;
  max-height: 100px;
  width: 100%;
  padding: 10px;
  overflow-y: scroll;
}

#insideDiv {
  background-color: pink;
  max-height: inherit;
  overflow-y: auto;
}