Need help? Check out our Support site, then


Need navigation bar to stay on top of page while scrolling

  1. Hi, I would like the main navigation bar for my SELA themed website to stay on top, while someone scrolls down the page. Please let me know, thanks

    The blog I need help with is advertisingauditandresearch.com.

  2. Hi there!

    You could fix the menu bar to the very top of your page by adding the following snippet to the CSS panel of the WordPress.com Customizer:

    @media screen and (min-width: 768px) {
    .main-navigation {
        position: fixed;
        top: 0;
        left: 0;
        width: 92.5%;
        z-index: 999999;
    }
    
    .admin-bar .main-navigation {
        top: 32px;
    }
    
    .site {
        margin-top: 58px;
    }
    }

    Give that a try and let me know if it works out for you. :)

  3. Thank you, the code works well.

    Also, I was wondering if I could keep the original format of Sela and have both the title/header and navigation bar stay fixed at the top, while I scroll down the page. If you have any ideas, would appreciate it. Thanks again.

  4. You could try the following to fix the whole header to the very top of your site:

    @media screen and (min-width: 768px) {
    header#masthead {
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 999;
        left: 0;
    }
    
    .admin-bar header#masthead {
        top: 32px;
    }
    
    .site {
        margin-top: 214px;
    }
    }

    Let me know how that goes. :)

  5. Ok thanks, I appreciate it. Works well

  6. Perfect! If you have any extra questions on customising your theme, please feel free to start another thread here or on our dedicated CSS forum:

    https://en.forums.wordpress.com/forum/css-customization

    Thanks!

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.