Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #15982

    Hi there,

    Can you please tell me if it’s possible to have the header of my website stay in a fixed position so that my visitors will always have access to the top navigation no matter how far they scroll down?

    Many thanks,

    Peter

    #89697

    Hi Peter,

    Try to add this code in your Quick CSS or custom.css:

    #header .container, #social_container .container {
    position: fixed !important;
    left: 50% !important;
    margin-left: -465px !important;
    }

    #header .container {
    margin-top: 40px;
    }

    #main {
    margin-top: 200px;
    }

    Just adjust the margin-top value. :)

    Regards,

    Ismael

    #89698

    Very cool Ismael, it does work except for one thing. The background is transparent. Can you help me fix that?

    I’ve installed it on a staging site: http://dev.notashamedofthegospel.com/

    #89699

    Hi peezar,

    Just replace this code:

    #header .container, #social_container .container {
    position: fixed !important;
    left: 50% !important;
    margin-left: -465px !important;
    }

    With this code:

    #header .container, #social_container .container {
    position: fixed !important;
    left: 50% !important;
    margin-left: -465px !important;
    background: white !important;
    }

    Hope this helps. :)

    Regards,

    Ismael

    #89700

    That is a HUGE help, thanks Ismael! Can I ask you please just one last question? How can I get the blue line in the header to also scroll down with the rest?

    http://dev.notashamedofthegospel.com/

    #89701

    Hi,

    Please edit the snippet I gave you and add this.

    #header .container, #social_container .container {
    position: fixed !important;
    left: 50% !important;
    margin-left: -465px !important;
    background: white !important;
    top: 7px;
    }

    .color_strip {
    position: fixed;
    width: 100%;
    height: 7px;
    top: 0px;
    z-index: 100000;
    }

    Regards,

    Ismael

    #89702

    Awesome, thanks so much :-)

    #89703

    Hi peezar,

    Glad that we could help you. :)

    Cheers,

    Ismael

Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘Fixed Header’ is closed to new replies.