Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #217623

    Hi there,

    I think I solved this problem for the iPad portrait mode thanks to the link Yigit gave me (https://kriesi.at/support/topic/navigation-menu-on-ipad-portrait-view/#post-216753). But the thing is that even on my computer screen if I reduce the window of the browser, there is a point where menu and logo get one into another… There isn’t this on the demo, the menu goes to “mobile menu” just before menu and logo get smashed together. Thanks for your help !

    Marie

    http://eq59799.amanda6.nfrance.com/

    #218782

    Hey marienoisette!

    Please try adding following code to Quick CSS in Enfold theme options under Styling tab

    @media only screen and (min-width: 767px) and (max-width: 989px) {
    .main_menu ul:first-child > li > a { font-size: 11px; }
    .responsive .main_menu ul:first-child > li > a { padding: 0 5px; }}

    Best regards,
    Yigit

    #218787

    Hi Yigit,
    – Thank you but it doesn’t seem to have any affect when I reduce the window of the browser…
    – Also, for what concerns the iPad, I don’t have a tablet myself, but it seems from what someone told me, that changes made for the iPad portrait mode dont work either… (though I changed – as you told me to – the switchWidth to 1000 in the js. file / line 300).

    And this is the code in Quick CSS for those two matters :

    /* Responsive menu TABLET */
    @media only screen and (max-width: 989px) and (min-width: 768px) {
    .responsive .mobile_menu_tablet .main_menu {
    display: block;
    }
    }

    /* Menu and logo not one into another */
    @media only screen and (min-width: 767px) and (max-width: 989px) {
    .main_menu ul:first-child > li > a { font-size: 11px; }
    .responsive .main_menu ul:first-child > li > a { padding: 0 5px; }}

    Am I wrong ??
    Thanks…

    Marie

    #220048

    Hey!

    You will need to change the point when the mobile menu appears to fit the larger menu. See: http://kriesi.at/documentation/enfold/change-when-mobile-menu-appears/

    So for you it would be 990px instead of the default 767.

    Regards,
    Devin

    #220062

    Hey Devin,
    Thanks but as I said (see the third line of my message) I’ve already changed the JS file line 300 and put 1000 instead of 767…
    It doesn’t change anything. Dis I miss something else ?
    Just to be clear I have this problem :
    1/ for the iPad portrait mode
    2/ on my normal computer when I reduce the window -> there is a bad “in-between” size -> when the window is large it’s perfect, I reduce it again it still works fine, I reduce it again and then instead of going straight to mobile menu it doesn’t, so items of the menu and logo get one into another, then I reduce it again and all right it goes to mobile menu.
    You can check my link yourself, better than my explanations in bad english :)
    Please please help… :))
    Thank you.
    Marie

    #220502

    You *must* also do step 2 and use the new css to hide the menu and show the mobile button. So this css must be in either your custom.css file or the Quick CSS:

    /*Hide the menu*/
    @media only screen and (max-width: 990px) {
      .responsive #header .main_menu ul {
        display: none;
      }
    }
    /*Show the Mobile Navigation button*/
    @media only screen and (max-width: 990px){
      .mobile_active #advanced_menu_toggle {
        display: block;
      }
    }
    #220504

    Devin,
    THANK YOU SO MUCH !!!
    I’m happy :)
    Marie

    #220510

    Glad we could help :)

Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Menu and logo one into another’ is closed to new replies.