Tagged: , , ,

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • February 14, 2024 at 12:07 pm #1434280
    AnnemarieDoolin

    I have so many problems trying to get the right spacing for the mobile header… i.e. making enough room for the logo, burger and search icons and shopping cart. I tried putting styling in but every time I do that another device view goes “skew wiff”. I tried taking out all my css styling so it should default to Enfold settings but still the burger and search icons end up hiding behind the basket on some device sizes.

    POSSIBLE SOLUTION? Thinking outside the box… I thought that if I changed the header layout to “Logo center, Menu below” the mobile menu container options would move down underneath the logo as the main menu DOES ON PC size but it doesn’t.

    ANY SUGGESTIONS from you wonderful genius’ would be so appreciated.
    HerbalCenter.dk

    Regards,
    Annemarie

    February 14, 2024 at 7:04 pm #1434314
    Rikard

    Hey Annemarie,

    This CSS seems to be causing some problems, please try taking it out:

    @media only screen and (max-width: 767px) {
  .responsive #top #wrap_all .main_menu {
    left: 400px !important;
  }
}

    Best regards,
    Rikard

    February 15, 2024 at 12:43 pm #1434399
    AnnemarieDoolin

    Hej Rikard,

    Thanks for your input.. with another couple of hours “wiggling”, I managed to get the search, burger and shopping cart to view fully.

    I’m still hanging onto the dream of having the icons on a new line under the logo so it’s pc and mobiles are consistently: “Logo centre, Menu below”. The mobile header is so difficult to make changes too as we don’t have your wizardry skills :-)

    Kind regards,
    Annemarie

    February 15, 2024 at 4:56 pm #1434426
    Rikard

    Hi,

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

    @media only screen and (max-width: 767px) {
  .responsive #top #wrap_all .main_menu {
    position: inherit;
  }
  .responsive #top .av-logo-container .avia-menu {
    width: 100%;
  }
  .responsive #top .av-main-nav {
    display: table;
    margin: 0 auto;
  }
  .responsive #top .logo {
    width: 100%;
  }
  .responsive .logo img {
    display: table;
    margin: 0 auto;
  }
}

    Best regards,
    Rikard

    February 16, 2024 at 9:37 am #1434472
    AnnemarieDoolin

    FANTASTIC Rikard, that worked. Thank you so much!

    February 16, 2024 at 12:48 pm #1434498
    Rikard

    Hi,

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

    Best regards,
    Rikard

    February 16, 2024 at 5:22 pm #1434522
    AnnemarieDoolin

    Thanks Rikard, this exciting adventure is closed. :-)

    February 17, 2024 at 11:12 am #1434555
    Rikard

    Hi,

    Thanks for letting us know, we’ll close this thread for now then :-)

    Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Mobile Burger: Can it be moved down so logo center and burger menu below’ is closed to new replies.