Creating a nav element with clickables that have a class while the nav bar is an id

1

how’s that possible? one would ovveride the other right?

3

project: product landing page. user story: #5

how is it the element itself nav can have an id while it’s clickables can have a class?

5

even when i review i tend to not recalls as well. i have gone back to take a look

6

i know that one of them overrides the other if they have both

8 
 <nav id="nav-bar" class="nav-link">
     <ol>
    <li class="nav-link"><a href="https://www.apple.com/ipad/" target="blank">ipad</a></li>
10

my mistake. ok my code which i had put id like in the previous user story conflicts when i put the class within that nav element because the coder tests are not seeing it. im wondering in that here code has some problem that i don’t know

11

is it asking i do an internal link?

12

If you cannot be specific, we cannot help you. There are people on the forum who are eager to be helpful, but they cannot do so if they have to fight just to understand what your situation is.
Before anyone can help please:

  • Provide the relevant code
  • Provide a working link to your project
  • Describe the problem in detail: What exactly is failing? How is it failing?
  • Describe the solutions you have attempted: What were you trying to accomplish? How did you expect them to work? What parts do you and don’t you understand.
  • Read the user stories carefully. Make sure you understand them. Ask specific questions if you do not.
  • Revisit the relevant parts of the curriculum Make sure that you understand them. Ask specific questions if you do not.
1 Like
13

yes i have adhd which leads me to kind of being not omitive but hasteful/impulsive with my response your post is helpful in letting me know what to response with.

my code nav bar that i am trying to do user story# 5 is failing that test.
the instructions are clear, yet im not seeming to see what is the problem. even the code is working.

  <nav id="nav-bar" class="nav-link">
     <ol>
    <li class="nav-link"><a href="https://www.apple.com/ipad/" target="blank">ipad</a></li>
    <li class="nav-link"><a href="https://www.apple.com/watch/" target="blank">watch</a></li>
    <li class="nav-link"><a href="https://www.apple.com/iphone-11/" target="blank">iphone</a></li>
    </ol>

  <nav id="nav-bar" >
    <ol>
    <li class="nav-link"><a href="#nav-link">ipad</a></li>
      <li class="nav-link"><a href="#nav-link">watch</a></li>
      <li class="nav-link"><a href="#nav-link">iphone</a></li>
    </ol>
    
  </nav>
  
  <p class="nav-link">iphone has cool features </p>
15

the nav code is failing the test

17

damn my adhd

darn i mean

18

<button>?

gah humbug

20

that would be <a>

right?

21 
<nav id="nav-bar">
      <a href=".nav-link" class="nav-link"          </a>
22
23

I understand that you have trouble focusing, but you need to slow down your process of posting here until you have been able to actually look at your code changes and check it over yourself. That isn’t a valid tag and if you’ve done the freeCodeCamp lessons, then you know that. Please respect the time and energy of our community members by asking questions about problems that you can’t solve yourself. Right now you’re basically using this forum as programming spellcheck.

24

Okay, so now your anchors have the proper class, which is great. But for internal page links, you can’t target a class, as a class can be used by any number of elements on the page.

HTML has always expected element IDs to be unique. Doing that allows our internal page links (the anchor elements in your case, with the nav-link class) to redirect to other elements with the appropriate id. The id is unique, so an anchor with that as it’s target will only go to that one place.

Think about it - if I were able to have an anchor link to .nav-link elements, how would it know which one?

Change your href to point to the id of the element you want it to take you to, and you should be getting closer.

EDIT: This is relating specifically to the code you included here, with the class assigned to the anchor. Not to your codepen.

25

i figured out that nav problem

right as you posted

woo hoo

26

what does it mean that the nav should at the top of viewport

27

i figured out user story 5 but the part which is separate from user story 5 says the nav should be at the top of viewport