WordPress.org

Support

Support » Themes and Templates » Make theme and top header Fixed and only body scroll

Make theme and top header Fixed and only body scroll

  • Hello, I am trying to code in my child theme so that the header and the top navigation bar are fixed and only the body scrolls. I’ve tried looking through the forums but I can’t get anything to work.

    thanks in advance

Viewing 5 replies - 1 through 5 (of 5 total)
  • add position:fixed to the css of the header.

    If you post your code, I’ll show you where to put position:fixed, if you aren’t sure.

    Thanks! that worked however it moved the header from where it was originally here is my site:

    http://www.fillyshred.com/install/

    and this is what I had in the code
    /***************header************************/
    #header {
    position:fixed
    }

    #navigation{position:fixed;z-index:1}
    #navigation-frill{position:fixed;z-index:2;margin-top:25px}

    That looks good to me.

    okay I added those code and it made the the navigation finally stay fixed but the header is now moved up and is cut off and it is not fixed. I also cannot get the about, contact, etc to move over to the left so the contact page is not overlapping the search tab this is the code I have for all of those. I tried using the tool on firefox to make edits but I am not super knowledge and I am just learning. Those are the only major changes I wanted to make to the template.

    Thank you for your patience. This is the code I have attempted to fix all those problems
    /***************header************************/

    #navigation{position:fixed;z-index:1}
    #navigation-frill{position:fixed;z-index:2;margin-top:25px}

    /***************navbar************************/

    #nav-menu {
    display: block;
    float: left;
    position: fixed;
    font-family: Arvo,Cambria,Georgia,Times,serif;
    font-size: 14px;
    margin: -4px 0px 4px -16px;
    width: 600px;

    }

    #navigation{position:fixed;z-index:1}
    #navigation-frill{position:fixed;z-index:2;margin-top:25px}

    #wrapper {
    text-align: left;
    width: 750;

    Sorry, I’d like to help, but your template is giving me a headache. Also, I should be getting back to work.

    Remove the width from #nav-menu and set the width for .wrapper to be more than 690px.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Make theme and top header Fixed and only body scroll’ is closed to new replies.