Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #1291075

    Hi.
    The menu on our site is not well responsive when scaling down the browser window. In a large window all menu items are shown in one horizontal row. In a very small window it changes to burger menu. But in medium size window, before it changes to burger menu, the last item is popped down below the first item and below the menu. It looks strange and I want to fix this, but how?

    General Layout:
    Layout: Streched Layout, Logo and Main Menu: Top header
    Dimensions: Responsive site is checked. Maximum container width is set to 1310px,

    Header:
    Header behaviour: Sticky Header (nothing else checked)

    Thank you,
    Hanna

    #1291687

    Hey Hanna,

    Please try this in Quick CSS, in order to switch to the burger menu at an earlier point:

    @media only screen and (max-width: 1250px) {
      nav.main_menu {
        display: block !important;
      }
      #avia-menu .menu-item {
        display: none;
      }
      .av-burger-menu-main.menu-item-avia-special {
        display: block;
      }
    }
    

    Best regards,
    Rikard

    #1292734

    Hi Rikard.

    I tried the CSS code and it does switch to a burger menu at an earlier point, solving the problem where the last meny object jumps below all others. But the burger menu is not looking or working properly in this in-between-format compared to the smallest format.
    The burger menu itself is centralised in stead of aligned to the right as in the smallest window. And when opening the menu it looks different from the one in the smallest format – the burger menu itself pops to the right, while the X to close it is centralised in the window and not inside the menu to the right. Menu items that are hidden in the smallest view are visible here, but behind the burger menu, and the main menu titles are not readable. Probably because there is white text on white background. Only sub menu titles are readable, they are in white text on grey background. Preferably this opened menu should look exactly like the one in a smaller window, where all the text is grey on white background.
    So, how to make this burger menu look and work with the page the same way as with the smallest format (mobile friendly format)?

    Best regards,
    Hanna

    #1293058

    Hi Hanna,

    Thanks for the update. I checked your site, but I can’t see anything like that on my end. Could you post a screenshot of what you are seeing on your end, and on which screen resolutions you are seeing it on please?

    Best regards,
    Rikard

    #1293207

    Hi. Sure. But how do I attach a screenshot here? I can only see options to enclose a link…

    #1293238

    Oh. and no, you would not see the problem now, because I removed the CSS code so that the page would work for visitors

    #1293618

    Hi,

    You can upload screenshots to services like Dropbox, Google Drive, Imgur etc, then link to them here. We would need to see the actual problem on your site in order to help you out, would it be ok if we added it to see the problem? If so, then please include admin WordPress login details with your next reply as well.

    Best regards,
    Rikard

    #1293878

    Hi,
    Ok, see private content for screenshots and login.

    /Hanna

    #1294189

    Hi Hanna,

    Could you please try changing following code

    #header_main .widget.widget_text {
        position: absolute;
        right: 20%;
        top: -5px;
        z-index: 999;
    }

    to following one

    #header_main .widget.widget_text {
        position: absolute;
        right: 20%;
        top: -5px;
        z-index: 2;
    }

    Your security plugin locked me out :)

    Best regards,
    Yigit

    #1294264

    Hi,
    Ok. but where do I find and change this code?
    I can´t find it under: Theme Options –> General Styling –> Quick CSS or: Appearance –> Customize –> Additional CSS
    I am a rookie in this field, so I am very thankful for a detailed guide.

    Thank you!
    Hanna

    #1294696

    Hi,

    The login details you posted earlier are not working anymore. Please post working login details in private, so that we can try to find the CSS for you.

    Best regards,
    Rikard

    #1294777

    My login seems to only work for me on my computer, not on others. I will have to ask WordPress support to help me with this so that you guys can login too. I will be back.

    #1294786

    Try new login in private message:

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

You must be logged in to reply to this topic.