Navigation
Archive / Header overlaps content
This is archived content. Visit our new forum.

Tagged: 

1 2 3
  • Author
    Posts
  • June 29, 2016 at 11:52 am #1065128
    bryan1976
    Participant

    Hi,

    Please visit this page and see that my header is overlapping the content:

    http://dev.theaudiobarn.co.uk/product/atc-scm11/

    Can you help. I would like to keep the header as it is.

    Thanks,

    Bryan

    June 29, 2016 at 12:28 pm #1065197
    Joao
    Moderator

    Hi There

    In order that we can have a look what is causing the issue, would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

    – Link to your site
    – WordPress Admin username / password

    Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

    Thanks

    Joao

    June 29, 2016 at 1:14 pm #1065284
    bryan1976
    Participant
    This reply has been marked as private.
    June 29, 2016 at 2:36 pm #1065405
    Nabeel A
    Moderator

    Hi again,

    Please add the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:

    header.masthead {
    min-height: 91px !important;
}

    Let us know how this goes!

    June 29, 2016 at 3:00 pm #1065441
    bryan1976
    Participant

    Hi,

    OK so this works for all pages, but I want the slider on the homepage to appear UNDER the header (which is transparent).

    Hope this makes sense.

    I have added the CSS, at 90px.

    Thanks,

    Bryan

    June 29, 2016 at 6:00 pm #1065664
    Friech
    Moderator

    Hi Bryan,

    Please update the given CSS code to this:

    body:not(.home) header.masthead {min-height: 91px !important;}
.home .x-navbar {background-color: transparent;}

    Hope it helps, Cheers!

    June 30, 2016 at 3:07 am #1066378
    bryan1976
    Participant

    Perfect – thank you!

    June 30, 2016 at 4:34 am #1066455
    Lely
    Moderator

    You’re welcome!

    Cheers!

    July 3, 2016 at 7:11 am #1070291
    bryan1976
    Participant
    This reply has been marked as private.
    July 3, 2016 at 8:02 am #1070323
    Christopher
    Moderator

    Hi there,

    Please add following code in Customize -> Custom -> CSS :

    body.x-navbar-fixed-top-active .x-navbar-wrap {
    height: auto;
}

    Hope that helps.

    July 3, 2016 at 8:23 am #1070341
    bryan1976
    Participant

    Hi,

    Pretty close, but can the white line be removed that now appears under the header? See attached.

    Thanks.

    Bryan

    July 3, 2016 at 8:24 am #1070344
    bryan1976
    Participant
    This reply has been marked as private.
    July 3, 2016 at 10:04 am #1070402
    Rupok
    Member

    Hi there,

    Thanks for updating. Kindly remove the following code to get rid of the line :

    .x-navbar-fixed-top-active .x-navbar-wrap {
  margin-bottom: 1px;
}

    Hope this helps.

    July 3, 2016 at 11:05 am #1070447
    bryan1976
    Participant

    Hi,

    This is OK on every page apart from the homepage where I want the transparent header in front of the layer slider, so that the slides work behind the header and can be seen ‘through’ the menu etc.

    Thanks,

    Bryan

    July 3, 2016 at 1:19 pm #1070570
    Rupok
    Member

    Hi Bryan,

    This is completely unnecessary code so I have no clue why you have added this and want to keep this. However if you still need to keep this then you can add the below code as well :

    .home.x-navbar-fixed-top-active .x-navbar-wrap {
  margin-bottom: 0;
}

    Thanks

  • Author
    Posts
1 2 3
  • <script> jQuery(function($){ $("#no-reply-1065128 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>