Navigation bar doesn't get fixed when using position:fixed

Question

I'm trying to set my navigation bar to fixed which is something I've done lots of times before, but for some reason it's not working.

I thought it might do with the fact that I was using a transition, but after deleting the transition the problem does persist.

I am using ReactJS but as I see on CodePen it is not what's causing this.

I created a pen with the code:

https://codepen.io/anon/pen/yGzrgj

Some(Random.Code) {
    Required(by.StackOverflow(to.post){ 
        this.question
    }
}

Reac

As you see nav's got position:fixed but the navigation bar doesn't stay where it is while scrolling.

Thanks in advance guys!

Answer 1

Well, you're not using position:fixed as Mr Cavus has observed. You have this:

nav {
  display: fixed;
}

No such setting, as you already know, or you wouldn't have it as position: fixed in your title. You'll want to do something like this:

nav {
  position:fixed;
  width: 100%;
}

If you want your menu to be centered.