Search code examples
csswordpressmenunavigationsticky

Wordpress how to make sticky navigation menu / make the menu stick to the top all the time?

I am using Wordpress default theme Twenty Twelve, my website is: http://ninarakovec.com.

I would like to make my existing navigation menu stick to the top all the time whilst scrolling, for example like website called wpsites (can't post the link because of stackoverflow's link limit).

You can view the theme's CSS here: http://pastebin.com/muXyT6AY

How would I go on about doing this, I have no idea what to do, I currently have made it so you can click on the navigation bar and it takes you to that respective section on the page, but the menu doesn't stick to the top so it isn't what I wanted. Please help!

Solution

  • This should work:

    .site-header {
    position: fixed;
    top: 0;
    width: 100%;
    left: 0;
    background-color: lightblue;
    z-index: 1000;
}
.main-navigation ul.nav-menu {
    border: 0;
}