Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Creating a responsive nav header that always remains at the top (when scrolling down)

Hi there,

I've been through the 'How to make a website' track, which is great. I'm finding the next part of this track (HTML) a bit boring/easy in comparison and it's killed my motivation somewhat. So, i'd like to try to adapt the nice responsive 'portfolio' design a bit.

My question - could anyone point me in the right direct on how to create a navigation bar at the top that always stays in place. An example can be seen at the top here https://jawbone.com/up

Is there another lesson which teaches this, or a page with some example code on how to achieve this with CSS? Or, would you suggest i keep progressing and tackle this task with another code, such as java?

I'm intending to learn html, css, java and php through Treehouse..

Thanks so much.

James

2 Answers

Hi James,

Here is a page where you can play around with some code that achieves this: http://jsfiddle.net/CriddleCraddle/Wj9dD/

I believe you will find that there are a lot of ways to make the nav bar sticky. Bootstrap has this baked in, if I remember correctly.

Good luck!

Thanks, David. Looks like this uses Javascript, so i'll just push on through on the lesson for a while longer.