Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #230370

    We are experiencing an issue on our site in regards to the top navigation overlapping the logo on mobile devices (iPhone, iPad) and when a browser window is re-sized to be smaller than the width of the menu.

    It seems that the proper functionality is for the logo to be resized small, and the menu navigation links to drop below the logo. Instead, the logo is not resizing, and the menu navigation is flowing over the logo.

    We have began to experiment with other browsers, and have found this to occur mostly in Google Chrome.

    Any thoughts on how to fix this?

    #230481

    Hi v2ginteractive!

    Please give us a link to the website. A screenshot of the issue will help.

    Regards,
    Ismael

    #233441
    This reply has been marked as private.
    #233445

    Your live demo of Enfold appears to function as loading the full menu and then recognizing that the menu extends too far to the left, so it then loads the mobile menu icon. Our sites are not doing that for some reason.

    #233458

    Hey!

    Please update Enfold to the latest version 2.5.4. There have been improvements done to the header elements since the version you are using – http://www.kriesi.at/documentation/enfold/updating-your-theme-files/

    Cheers!
    Yigit

    #233873

    Yigit, will this update compromise any of the customizations that we made? I can’t say for certain, as I am not the only developer of the site, but there may have been adjustments to the theme files using the WordPress Editor. There have definitely been several CSS changes made using the Quick CSS form in the Styling section of Enfold Theme Options.

    Thanks.

    #233875

    Hey!

    If you are not using a child theme ( http://www.kriesi.at/documentation/enfold/using-a-child-theme/ ) changes you have made on theme files will be lost unfortunately, but styling changes in Quick CSS will remain as long as theme names are matching. If you have noted the changes you have made on theme files, i would recommend you to use a child theme and re-do the changes you have made

    Cheers!
    Yigit

    #234013

    Hi,

    I updated the theme to 2.5.4 using the Theme Update option within Enfold Theme Options. The problem of the responsive menu on iPad remains unchanged. The site appears exactly the same on iPad in terms of the header menu (see previous screenshots).

    Some of my current Enfold Theme Options settings are as follows:
    Header Type: Small Fixed Header
    Append search icon to main menu: Unchecked
    Responsive Header Main Menu: Display as Slide Out Menu
    Quick CSS:
    .main_menu ul:first-child > li > a {font-size:15px;}

    .title_container .breadcrumb {
    display: none !important;
    }

    #js_sort_items .sort_by_cat a{
    font-size: 16px;
    }

    h1.main-title.entry-title {
    font-size:24px;color:#000000;
    }

    .header_color .main_menu .menu ul li a:hover {
    background-color: #eae2db;
    }

    /*ROLLOVER/CURRENT MENU DECORATION*/
    .header_color .avia-menu-fx {
    background-color: #423222;
    }
    .header_color .avia-menu-fx .avia-arrow, .header_color .main_menu ul:first-child >li > ul, #top .header_color .avia_mega_div > .sub-menu {
    border-color: #423222;
    }

    .alternate_color .avia-icon-list .iconlist_icon, .main_color .avia-icon-list .iconlist_icon { background-color: #423222; }

    #top #gform_4 input[type=”text”],
    #top #gform_5 input[type=”text”],
    #top #gform_6 input[type=”text”],
    #top #gform_7 input[type=”text”],
    #top #gform_9 input[type=”text”],
    #top #gform_10 input[type=”text”],
    #top #gform_11 input[type=”text”] {
    width:474px;
    }

    Thanks!

    #234198
    This reply has been marked as private.
    #234787
    #234839

    Hi,

    I used the http://www.kriesi.at/documentation/enfold/change-when-mobile-menu-appears/ tutorial and was able to fix my mobile menu issue. I also changed the code to be triggered by 6 or more menu items, rather than 7, because a few of our menu titles are long.

    Thanks,
    Shawn

    #234841

    Hey!

    Glad we could help Shawn, let us know if you have any other questions or issues

    Cheers!
    Yigit

Viewing 12 posts - 1 through 12 (of 12 total)

The topic ‘Menu Overlapping Navigation in Mobile Devices and When Window is Scaled Down’ is closed to new replies.