iOS not scrolling div

Question

Right so I have a div that is supposed to be scrolling (works fine in Chrome and other browsers). It will not scroll on iOS, and the page itself is using jQuery and jQuery Mobile.

Here is my SCSS:

#level-2 {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0; left: 100%;
  padding-top: 50px;
  box-sizing: border-box;
  background: rgb(0,0,0);
  overflow-y: auto;

  #level-2-tabs {
    position: fixed;
    top: 50px;
    width: 100%;
    height: 90px;

  #level-2-cards { padding-top: 90px; }

  .level-2-card {
    width: 100%;
    color: black;
    padding: 20px;
    box-sizing: border-box;
    border-left: 2px solid white;
    border-right: 2px solid white;
    border-bottom: 2px solid white;

JQuery adds a bunch of cards to the #level-2-cards div and I also have a #page as the wrapper:

#page {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

I read somewhere that position:fixed was not liked by Apple so I changed it and it still messed up, same with adding the -webkit-overflow-scrolling:touch and the trick from this page: -webkit-overflow-scrolling: touch; breaks in Apple's iOS8

None of these work. Any help is highly appreciated. Thanks.

Answer 1

Maybe this ?

#page {
  overflow: visible !important;
}

Answer 2

As well as

overflow-y: auto;

add

-webkit-overflow-scrolling: touch;