I have set the height of the header as 170px but this making the main menu height to be also 170px. See the code below
.container .main_menu .av-main-nav > li > a{height:170px;line-height:170px}
I want to change this height to 40px but when I add it to child theme its getting overwritten by the inline style due the height being set to custom value in the header settings. Also If I add important to height and line-height its messing up the sub menu items
And one more question how to turn the regular menu on tablets and show only the mobile menu.
Thanks and aprpeciate it
Hey pepin,
Could you please give us a link to your website, we need more context to be able to help you.
Best regards,
Victoria
I was able to fix the menu height issue. I am trying to see if I can turn on mobile menu when width is below 1024px and turn off the regular menu
The setting that comes with the theme turn on mobile menu extend till width 990px
Thanks
Hi,
Please try the following in Quick CSS under Enfold->General Styling:
@media only screen and (max-width: 1024px) {
nav.main_menu {
display: block !important;
}
#avia-menu .menu-item {
display: none;
}
.av-burger-menu-main.menu-item-avia-special {
display: block;
}
}
Change the value 1024 to the pixel value of your choice.
Best regards,
Jordan Shannon