How to make a responsive navbar

1

How do websites make the nav bars take them to different sections on their pages? That is what I am trying to do with my codepen. I have looked all through w3 schools and i just dont understand, can someone explain?

2

I think what you’re looking for is called anchor tags.

3
4

I think that you’re lookign for something like:

<a href="#your-section-id">Section name</a>

If you could put your code in https://jsfiddle.net/ for example, I could help you better. I hope this does the job.

5

Thank you @Stahlone, I have never heard of that site, I like it already. Could you show me how to use the anchor tags?

https://jsfiddle.net/grantrogers22/hrfxp40m/15/

6

https://jsfiddle.net/grantrogers22/hrfxp40m/30/
use this one if so, this one is the most recent

7

Grant…

looking at your page you have a basic page with a nav bar and then some text. What you need to do is

  1. have a tag (eg
    ) around each block of text and that DIV has an ID (so in your example
<div id="about">info</div>
  1. change the href in your ABOUT nav element to be
<a href="#about">About</a>

and that will link the About word to the About id

8

something like

  <li><a href="#About">About</a></li>
  <li><a href="#Info">Info</a></li>
  <li><a href="#Contact">Contact</a></li>
  </ul>
</nav>
<body>
 Random Info
 
 
 <br>
 <br>
 <br>
 <br>
<div id="About">
About Section Goes Here
</div>
9

I have all the code in but it still wont do it, do I need java for it to be responsive?

10

Wait I got it, never-mind. Thank you so much, I have been trying to figure this out for awhile.