溢出-y隐藏了我绝对定位的元素

Question

我有一个垂直导航菜单，我希望它在y轴上滚动，因为它适用于移动用户。我希望菜单在点击一个绝对定位到菜单的图标时显示。但是当图标获取时在父母div中，它消失了。是的，我对这个问题了不起，所有人都说你必须在父div上设置相对位置，但在我的情况下，我的父div是position:fixed;。我试图制作这个的外部div并将位置设置为相对，但它不起作用..;（这是我的代码：

/*-----------------------------------------------
                Mobile Icon Style.
-----------------------------------------------*/
.mobile-icon{
position:absolute;
display:block;
  width: 40px;
z-index:5;
  right:-50px

}
.mobile-icon:before{
  width: 100%;
font-size:2em;
  font-family: "ElegantIcons";
  font-weight: bold;
  text-align: center;
  content: "\64";
}
.mobile-icon:hover{
color:white;
background:black;
}
/*-----------------------------------------------
                 Mobile Menu Style.
-----------------------------------------------*/
.mobile-menu{
overflow-y:scroll;
position:fixed;
height:100%;
width:70%;
background:white;
z-index:1000;
transform: translate3d(0 ,0 ,0);
transition:transform 0.4s ease;
}
.active-mobile-menu div{
transform:translate3d:(0, 0, 0);
}
.active-mobile-menu .mobile-menu{
transform:translate3d(100% ,0 ,0);
}
.mobile-menu ul{
top:10.2%;
color:black;
text-align:left;
font-weight:bold;
position:relative;
}
.mobile-menu li a {
display:block;
padding: 4% 0;
border-bottom:1px solid black;
}
.mobile-menu > ul> li:hover > a, .mobile-menu > ul> li:hover > .sub-menu > li:hover > a, .mobile-menu > ul .sub-menu  .sub-menu > li:hover > a{
background-color: #111;
color: #fff;
}
.mobile-menu ul li ul{
height:100%;
width:100%;
visibility:hidden;
display:none;
opacity:0;
transition:visibility 0s, opacity 0.5s linear;
background:#fff;
border:none;
position:relative;
}
.mobile-menu ul li:hover ul{
display:block;
opacity:1;
visibility:visible;
}

<div class="mobile-menu">
  <span class="mobile-icon"></span>
   <header class="mobile-header">
     <div class="mobile-branding">
<!--My Logo script is here -->
     </div>
   </header>
      <ul class="mobile-menu-ul">
         <div class="caret"></div>
         <?php wp_nav_menu(array(                         
          'theme_location'=> 
          This is the menu List
             1.
             2.
      </ul>
  </div>