CSS position: fixed; destroys my navbar

[Guest]

Sorry for spamming the forum with questions but I've found another issue. Upon trying to make a navbar that follows you as you scroll down the page, I found out position: fixed; should do that, but instead it ruins part of my page.

 

To quickly show whats going on, go here: http://jsfiddle.net/p3u6mwjn/

1. Click run, be witness to my amazing navbar,

2. Uncomment the first line in the css file,

3. Click run, and watch it get broken.

 

Any ideas? Positioning things in css is hard

Also ignore the spammy text, that's required for testing purposes.

Thanks

[skyress3000]

Add 

width: 100%;

to the navbar's CSS along with fixed position