Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • November 15, 2014 at 3:32 pm #351816
    style960

    Hi,

    How can I increase the mobile menu breakpoint to be greater than 990px? I have a long menu which is breaking onto a new line on iPad landscape.

    Thanks,
    Paul.

    November 16, 2014 at 7:24 pm #352115
    Josue

    Hey Paul!

    Try adding this code to the Quick CSS:

    @media only screen and (max-width: 1024px) {
.main_menu, #header_main_alternate{display:none;}
.container #advanced_menu_toggle, #advanced_menu_hide{display:block;}
#mobile-advanced{display:block;}
}

    Cheers! 
    Josue

    November 18, 2014 at 2:49 pm #352974
    style960
    This reply has been marked as private.
    November 19, 2014 at 2:59 am #353444
    Josue

    Hi Paul!

    Can you post a screenshot of that issue? i couldn’t note it on my end – http://screencast.com/t/2MqAD3ZpliE

    Cheers!
    Josue

    November 20, 2014 at 12:32 am #354064
    style960

    Hi, please link below. It does appear fine on an emulator. You can see the problem on the image when actually using an iPad.

    http://style960.com/enfold/home/

    Thanks,
    Paul.

    November 21, 2014 at 6:12 am #354905
    Andy

    Hi!

    try using this code:

    .html_header_top.html_bottom_nav_header .main_menu {
width: 106%;
left: -30px;
}

    Regards,
    Andy

    November 21, 2014 at 8:32 pm #355527
    style960

    Hi Andy,

    I’ve added the above code but no change effected to the menu. I appreciate the speedy replies but if the mobile button menu can’t be displayed properly on iPad landscape, I’ll need to switch themes, and quickly.

    Thanks again,
    Paul.

    November 23, 2014 at 3:51 pm #356240
    style960

    Any update on this? Do you have an iPad to replicate the issue on?

    Thanks.

    November 24, 2014 at 10:13 pm #357161
    Andy

    Hi!

    I can’t see you long menu any more. Did you remove it?
    My code should work for your long menu if you add this to it:

    @media only screen and (max-width: 1024px) { 
width: 106%;
left: -30px;
}}

    Try to play around with the numbers “106” and “30”, until you find what fits to you.

    I’ll flag this thread for someone who has an iPad however.

    Best regards,
    Andy

    • This reply was modified 10 years ago by Andy.
    November 24, 2014 at 11:39 pm #357220
    style960

    Hi Andy,

    I’m trying this on a dummy site at the moment – http://style960.com/enfold

    I only have tomorrow to fix this. The code you’ve suggested above doesn’t invoke the mobile menu at all on iPad landscape. In fact, the option to enable mobile menu for smartphone & tablets has no effect because the breakpoint is set to 990px.

    Thanks,
    Paul.

    November 24, 2014 at 11:52 pm #357229
    style960

    The original code above from Josue seems to work on a test site. #header_main_alternate is not removed though so an empty space remains. Seems a bit odd?

    November 27, 2014 at 3:26 am #358798
    Andy

    Hey!

    ok, I did not get that you want to display the mobile menu. You can do this easily in Enfold->Header->Mobile Menu->Header mobile menu activation->choose “activate for smartphones and tablets”

    Regards,
    Andy

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.