Header on tablet is a bit too heigh

Hey MaaikeVVV,

Can you try adding this css code in Quick CSS (located in Enfold > General Styling):

@media only screen and (max-width:1024px) and (min-width:768px) {
  #top .container.av-logo-container {
    height: 80px !important;
    line-height: 80px !important;
  }

  #top .logo a, 
  #top .logo img {
    max-height: 80px !important;
  }
}

Just adjust 80px to lesser value if it’s still too big. Hope this helps :)

Best regards,
Nikko

Hi Maaike,

You did not do anything wrong. You should try to clean the cache on your tablet or try on another tablet and see if the code gets applied. I adjusted the menu slightly, so that it does not fall out of the header. Hers is the code, you can put it in your child theme style.css:

@media only screen and (max-width:1024px) and (min-width:768px) {
  #top .container.av-logo-container {
    height: 80px !important;
    line-height: 80px !important;
  }

  #top .logo a, 
  #top .logo img {
    max-height: 80px !important;
  }
  .responsive .main_menu ul:first-child > li > a {
    padding: 0 8px;
}
#header_main_alternate .container {
    padding: 0 10px;
}
}

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