Tagged: ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • July 24, 2014 at 10:36 pm #295692
    klondike91

    When enfold is viewed on a tablet (landscape) the logo and main nav work fine. However, when you turn the tablet (iPad) to the portrait angle (tall, not wide) the menu gets covered by the logo because of the limited width? Is there anyway control for when the mobile menu is activated based on viewport size? Any suggestions would be appreciated.

    Thank you.

    July 24, 2014 at 10:47 pm #295693
    charger70

    i’ve had this problem on multiple sites. the solutions are as follows (for logo left / menu right):

    1. make sure your logo is no wider than 340 – smaller if possible
    2. make sure your nav is as SMALL as possible – short words, only a few of them
    3. turn on mobile menu for phones/tablets – header layout > mobile menu > pulldown to the combo setting

    that should help.

    July 24, 2014 at 11:23 pm #295698
    snackd

    See also my thread here.
    https://kriesi.at/support/topic/problem-with-menu-overlapping-logo-menu-disappears/

    The moderators mostly suggest to tackle the problem on a CSS level. It didn’t work for the longest time but was by the end. It allows you to control the point at which wideness of menu or skinniness of viewport trigger display of a smaller mobile-type menu.

    It’s still not a great solution — none of them are — because when the end user changes the menu (say, adds a new menu item), the CSS has to be manually modified to match :-/

    July 25, 2014 at 7:53 am #295810
    Ismael

    Hi!

    Thank you for using the theme.

    @klondlike: Do you mind if we take a look at the actual website?


    @charger70    : Thanks for helping out. Appreciated. :)


    @snackd    : You can tackle this via javascript but it will require a bit of modification which falls beyond the scope of support. Please hire someone to do it for you. Thank you for your understanding.

    Regards,
    Ismael

    July 25, 2014 at 3:18 pm #295984
    klondike91
    This reply has been marked as private.
    July 27, 2014 at 11:54 pm #296544
    Josue

    Hey!

    Try adding this code to the Quick CSS:

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

    Cheers! 
    Josue

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