title: Scrolling div inside absolute positioned parent
body: <p>I have an absolute positioned div and inside I have another div with content bigger than the parent. I need the child div to have a vertical scroll but my attempts are not workin. I need to do this without js. This is my code:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="container"&gt;
      &lt;div class="allow-scroll"&gt;
           ---CONTENT---
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.container{
      background: red;
      position: absolute;
      top:0;
      left:0;
      right: 50%;
      bottom: 50%;
      overflow: hidden;
  }
  .allow-scroll{
      overflow-y: scroll;
      position: relative;
      height: 100%:
  }
  </code></pre>
  
  <p>And a fiddle: <a href="https://jsfiddle.net/zasnj08z/" rel="nofollow">https://jsfiddle.net/zasnj08z/</a></p>