Enfold mobile menu under 990px setting not work when sidebar menu is activated.

Hi,

Thank you for the info.

Please try these css codes to force the header switch when the screen width is less than 1024px.

@media only screen and (max-width: 1024px) {
  .responsive #top #wrap_all #header {
    position: relative;
    width: 100%;
    float: none;
    height: auto;
    margin: 0 !important;
    opacity: 1;
  }

  .responsive #top #wrap_all .container {
    width: 85%;
    max-width: 85%;
    margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
    float: none;
  }

  .responsive #top .logo {
    position: static;
    display: table;
    height: 80px !important;
    float: none;
    padding: 0;
    border: none;
    width: 80%;
  }

  .responsive .logo a {
    display: table-cell;
    vertical-align: middle;
  }

  .responsive .logo img {
    height: auto !important;
    width: auto;
    max-width: 100%;
    margin: 0;
    display: block;
    max-height: 80px;
  }

  .responsive #header_main .inner-container, 
  .responsive .main_menu {
    position: static;
  }

  .main_menu .avia-menu, #header_main_alternate, 
  .fallback_menu {
    display: none;
  }

  .responsive #top #main {
    padding-top: 0 !important;
    margin: 0;
  }

  .container #advanced_menu_toggle, 
  #advanced_menu_hide {
    display: block;
  }

  .responsive.html_header_sidebar #top #header .social_bookmarks {
    display: none;
  }
}

Best regards,
Ismael

Hi,

It may require additional css modifications. Please provide the login details in the private field so that we can inspect the site properly.

Best regards,
Ismael

Hi,

Thank you for the update. The Appearance > Editor panel is not accessible. Please enable it. And upgrade the theme to version 4.2.6. We’ve added the remaining css modifications in the General Styling > Quick CSS field.

Best regards,
Ismael

Hi,

We adjusted the css codes. The layout should switch to top header when the screen width is less than 1024px.

Best regards,
Ismael