Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • November 20, 2018 at 1:11 pm #1035575
    Petra_MUC

    Dear all,
    sometimes my customers have many menu items.Therefore I usually use the following code to let the main menu switch to the burger menu on small devices with a higher resolution than 990px. The code has always worked very well. Unfortunately it doesn’t work with the latest Enfold version.
    What shall I do?

    Many thanks in advance,
    Petra

    @media only screen and
    (max-device-width: 1250px) {
    .av-burger-menu-main {display: block;}
    .menu-item {display: none;} }

    November 21, 2018 at 4:25 pm #1036151
    Victoria

    Hey Petra_MUC,

    Could you please give us a link to your website, we need more context to be able to help you.

    Best regards,
    Victoria

    November 21, 2018 at 5:19 pm #1036187
    Petra_MUC

    Hey Victoria,
    many thanks for your answer. You’ll find the URL below.
    Best regards,
    Petra

    November 22, 2018 at 2:59 pm #1036534
    Victoria

    Hi Petra_MUC,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

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

    If you need further assistance please let us know.

    Best regards,
    Victoria

    November 22, 2018 at 6:31 pm #1036685
    Petra_MUC

    Hi Victoria,

    it still doesn’t work. I put your code in style.css (Child-Theme) and custom.css (Enfold), but nothing happened.
    I really don’t understand why. Even my code ever worked with former Enfold versions.
    Do you have an idea what goes wrong with your latest release?

    Best regards,
    Petra

    November 22, 2018 at 6:56 pm #1036709
    Victoria

    Hi Petra_MUC,

    Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

    Best regards,
    Victoria

    November 22, 2018 at 11:25 pm #1036814
    Petra_MUC

    Hi Victoria,
    thank you very much! You’ll find the login credentials below.

    Best regards,
    Petra

    November 23, 2018 at 8:08 am #1036872
    Mike

    Hi,
    Thanks for the login, I added Victoria’s code to your Quick CSS and clear my browser cache, and it is working.
    Please clear your browser cache and check.

    Best regards,
    Mike

    November 23, 2018 at 9:46 am #1036885
    Petra_MUC

    Hi Mike,
    thank you so much! I really feel ashamed not to come up with the idea of doing this. Because it worked on websites with older Enfold versions when I tested it? Murphy’s law?!
    Best regards,
    Petra

    November 23, 2018 at 2:47 pm #1036968
    Mike

    Hi,
    Glad to hear it works, please don’t feel bad, you were using “max-device-width” but I have always used “max-width”
    Please see this explanation about the difference of the two.
    Unless there is anything else we can assist with on this issue, shall we close this then?

    Best regards,
    Mike

    November 24, 2018 at 12:27 pm #1037226
    Petra_MUC

    Hi Mike,
    yes, you may close this issue!
    Best regards & many thanks for your valuable support,
    Petra

    November 24, 2018 at 10:30 pm #1037298
    Mike

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    For your information, you can take a look at Enfold documentation here
    For any other questions or issues, feel free to start new threads under Enfold sub forum and we will gladly try to help you :)

    Best regards,
    Mike

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘CSS for Burger Menu doesn't work with latest Enfold version’ is closed to new replies.