Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • August 30, 2016 at 7:09 pm #679642
    zimbo

    I have had to change the screen width at which this site switches to responsive because the menu is quite wide. All is OK using this code:

    @media only screen and (max-width: 1024px) {
nav.main_menu {display:none !important;}
#advanced_menu_toggle, #advanced_menu_hide {display:block !important;}
.responsive.html_mobile_menu_tablet .main_menu .avia-menu, .responsive.html_mobile_menu_tablet #header_main .social_bookmarks, .responsive.html_mobile_menu_tablet #header_main_alternate {
    display: none;}
}

    apart from the #header_main_alternate .container (I think) which does not switch off until Enfold does it at 989px so I’m left with a blank white space at the bottom of the header where the desktop menu used to be from 1024 px down to 989 px.

    See here.

    I’ve tried various combinations to get the white space to switch off but I cannot determine the correct elements to attach a display:none to – can you help?

    August 31, 2016 at 6:52 am #679825
    Jordan

    Hey zimbo,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    @media only screen and (max-width: 1024px){
.html_header_top.html_header_sticky.html_large.html_bottom_nav_header #main {
    padding-top: 118px;
}
}

    Best regards,
    Jordan

    August 31, 2016 at 3:56 pm #680056
    zimbo

    It nearly worked, but below 990px #main came up into the header so I modified your suggestion to
    @media only screen and (max-width: 1024px) and (min-width: 990px)
    and it’s OK now. Thanks.

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Turn off #header_main_alternate .container’ is closed to new replies.