Mobile Menu Covers Page Content on Safari and Chrome on iPhones

  • When viewed on iphone mobile phones, using safari or chrome browsers (all versions of iphone from 8 to 11) the mobile menu is being overlapped by page content.
    It makes it difficult to see the menu and the page content as the overlapping issue causes so much confusion.

    The submenu no matter how I try and grab the CSS also is too big. Not sure what the CSS selector should be for the sub menu. Normally I would set the z-index higher but tried that and no luck. I need this done asap for a massive marketing launch in google keywords this week. Please advise.

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Theme Author themevision

    (@themevision)

    Hi @toconnell1111,

    To fix the mobile menu items mixing up on the page issue please add this below CSS code to your Customization panel > Additional CSS.

    nav.mobile-menu {
    z-index: 999;
    position: sticky;
    max-height: 100%!important;
    }

    It will fix the issue on those both browsers you mentioned.

    Thanks,

Viewing 1 replies (of 1 total)
  • The topic ‘Mobile Menu Covers Page Content on Safari and Chrome on iPhones’ is closed to new replies.