Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • January 16, 2016 at 4:14 pm #566543
    shefferz

    Hi My site is full width of the page.

    I have 7 Menu items and when you make the browser window smaller the menu items overlaps onto the logo is there a way to fix this such as having to use the control arrows on the browser?

    January 16, 2016 at 8:55 pm #566590
    Basilis

    Hey shefferz!

    I have tried the menu and could not see any part that has an actual problem.
    Can you please let us know the screen size you tested it at?

    Regards,
    Basilis

    January 17, 2016 at 1:00 am #566653
    shefferz

    Basilis,

    I switched the layout to menu above menu center. – please check it now. I switched it back to logo left menu right.

    January 17, 2016 at 6:21 am #566740
    Rikard

    Hi,

    Please try the following in Quick CSS under Enfold–>General Styling to activate the mobile menu at an earlier stage:

    @media only screen and (max-width: 1175px) {
nav.main_menu {display:none !important;}
#advanced_menu_toggle, #advanced_menu_hide {display:block !important; }
}

    Thanks,
    Rikard

    January 17, 2016 at 2:43 pm #566802
    shefferz

    OK thanks that does work, however I dont like having the mobile menu on a PC screen.

    Would there be a way to trigger the Logo center, menu below header option once the screen width hits a certain width?

    January 18, 2016 at 6:07 am #566924
    Rikard

    Hi,

    It would most likely take a lot of customisation unfortunately, but send us an admin login in private and we’ll have a look. There seems to be a password prompt before being able to access your site now as well, please send details for that too.

    Thanks,
    Rikard

    January 18, 2016 at 11:51 pm #567474
    shefferz

    Hi Rikar,

    See below.

    January 19, 2016 at 11:37 pm #568222
    Andy

    Hey!

    you could try something like this:

    @media only screen and (max-width: 1150px) {
.logo {
left: 34%;
}
nav.main_menu {
display: block !important;
top: 59px;
}
#advanced_menu_toggle, #advanced_menu_hide {
display: none !important;
}}

    adjust it as needed, especially max-width value and even add a min-width value if needed.

    Best regards,
    Andy

    January 20, 2016 at 6:03 pm #568789
    shefferz

    We are getting in the right direct,

    however changing the % for .logo { left: 34%;} doesn’t move the logo center above the menu.

    Also – when the menu right drops down and goes below the logo – I need the header background to drop down as well so you can read the menu text.

    Thanks!

    January 21, 2016 at 1:57 pm #569378
    Andy

    Hey!

    then try to add an !important to it: 

    .logo {
left: 34% !important;
}

    Best regards,
    Andy

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