Help w/ Nav bar and fixed positioning

[sneakyleaf96]

hey guys,

 

how can I create a header bar background so that it is in back of my nav links?

my links are fixed so they stay when the user scrolls down to view images and text.

Im pretty sure though that when a user looks at the website through a mobile device

the fixed links will come closer together so when the user scrolls down they will see

the white bordered space around the logo.

 

Also when I try to move my "text-container" the first fixed link moves (floats on top of the text container )wherever I move it.

How can I seperate them? or make them non relative?

 

Thanks for your help!

 

here is the jsfiddle link: http://jsfiddle.net/sneakyleaf96/bqgjw0gb/8/

Edited October 16, 2014 by sneakyleaf96

[davej]

Your css code doesn't really make much sense. Why are p and h1 styled with a width and height? If you want the header to be fixed then why isn't it styled to be fixed? Why do you have things that are both fixed and floated? You also have some relative positioning that does nothing.