overflow-y:scroll does not work on mobiles

1.2k views Asked by At

I have been trying to figure it out for over a day and I don't know why is this happening.

I'm creating a new website for my company and I want it to be responsive. So when it changed to mobile size, the menu is changing quite drastically. However the menu does not scroll down, for some reason which I can't explain

When I use chrome developer tools for mobiles, it works great. However on the actual mobiles it does not work.

http://beta.vetosports.com

does anyone has any idea why is this happening?

checked on Samsung Note 3 and Samsung Galaxy S2. browsers chrome mobile and Dolphin.

@media only screen and (max-width: 767px)
#allCat > li > #allSubWrap {
  overflow-y: scroll;
  width: 80%;
  height: 80%;
  position: fixed !important;
}

<div id="allSubWrap">
    <div>
        <div>
            <ul>
                <li></li> 
                  ...
            </ul>
            <ul>
                <li></li> 
                  ...
            </ul>
            ...
        </div>
        <div class="clear"></div> <!-- clear:both -->
    </div>
    <div class="clear"></div>
</div>
0

There are 0 answers