Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • January 31, 2014 at 7:48 pm #217623
    Marie

    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/

    February 3, 2014 at 2:16 pm #218782
    Yigit

    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

    February 3, 2014 at 2:38 pm #218787
    Marie

    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

    February 5, 2014 at 6:46 pm #220048
    Devin

    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

    February 5, 2014 at 7:06 pm #220062
    Marie

    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

    February 6, 2014 at 4:56 pm #220502
    Devin

    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;
  }
}
    February 6, 2014 at 5:01 pm #220504
    Marie

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

    February 6, 2014 at 5:05 pm #220510
    Devin

    Glad we could help :)

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