Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • January 31, 2020 at 11:44 am #1180236
    Bix77

    Hello!
    I want to customize the breakpoint for the menu.
    In the theme-settings there’s this option to change between 768px and 990px. I would like to change it to 1200px. So that the burger menu appears already at 1200px.

    Could you give me a hint how to alter this in css? I tried a lot but can’t find the right selectors as it seems.

    Thank you,
    Angie.

    February 2, 2020 at 5:40 am #1180592
    Rikard

    Hey Bix77,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 1200px) {
  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

    February 24, 2020 at 11:32 am #1187259
    Bix77

    Thank you!

    February 25, 2020 at 4:28 am #1187532
    Rikard

    Hi,

    Great, I’m glad that we could help. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    June 8, 2020 at 2:21 pm #1220470
    onsite_org

    Hi Rikard, could you please help woth similar issue? I used
    /* Activate burger menu */
    @media only screen and (max-width: 1195px) {
    #top #header .av-main-nav > li.menu-item {
    display: none!important;
    }
    #top #header .av-burger-menu-main {
    cursor: pointer;
    display: block!important;
    }}

    and burger menu apperead , but not in desired position on top in row with the social icons. (instead it replaces the menu position)

    what do i have to modify ? thanks a lot, marcus (see private for link )

    June 9, 2020 at 9:02 am #1220768
    Rikard

    Hi onsite_org,

    Please try this CSS instead:

    @media only screen and (max-width: 1195px) {
#top #header .av-main-nav > li.menu-item {
display: none!important;
}
#top #header .av-burger-menu-main {
cursor: pointer;
display: block!important;
}
.responsive #top .av_mobile_menu_tablet #header_main_alternate {
    display: none;
}
}

    Best regards,
    Rikard

    June 9, 2020 at 11:21 am #1220821
    onsite_org

    Thanks Rikard, but no burger appears lower 1195px with this. I had to reset to former version. Any other Ideas ? thanks, marcus

    June 10, 2020 at 7:59 am #1221076
    Rikard

    Hi onsite_org,

    Thanks for the update. I can’t load your site anymore, did you move it? If so then please post a new link so that we can inspect it.

    Best regards,
    Rikard

    June 10, 2020 at 9:21 am #1221113
    onsite_org

    I am very sorry, yes we moved, final target see private.

    June 11, 2020 at 6:48 am #1221532
    Rikard

    Hi,

    Thanks for that. Please try this CSS as well:

    @media only screen and (max-width: 1195px) and (min-width: 768px) {
.responsive #top #wrap_all .av_mobile_menu_tablet .main_menu {
    top: 0;
    left: auto;
    right: 0;
    display: block;
}
}

    If that doesn’t help then please include admin login details in private.

    Best regards,
    Rikard

    June 11, 2020 at 1:10 pm #1221661
    onsite_org

    so sorry, still does not work. see private

    June 13, 2020 at 5:12 am #1222259
    Rikard

    Hi,

    Thanks for the update. I’ve adjusted the code a bit, it’s at the very top of your Quick CSS box, please review your site.

    Best regards,
    Rikard

    June 15, 2020 at 4:36 pm #1222728
    onsite_org

    Hi Rikard, this is great and functionning perfect, many thanks, marcus

    June 15, 2020 at 5:22 pm #1222764
    Victoria

    Hi onsite_org,

    Glad we could help :)

    If you need further assistance please let us know.
    Best regards,
    Victoria

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