Hello,
the exercise requires:
…the navbar should contain link ( a
) elements with the class of nav-link
. There should be one for every element with the class main-section
If I try to use more than one class in addition to nav-link, the software no longer sees the nav-link class and tells me that it is absent, for example:
<a href="#" class="nav-link other-class">some text hee</a>
I can only put the nav-link class to go forward:
<a href="#" class="nav-link" >text here</a>
Your browser information:
User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/101.0.4951.64 Safari/537.36
Challenge: Build a Technical Documentation Page
Link to the challenge:
Can you post the full code, so that it will be easier to find the problem.
It might be a problem with freecodecamp
Here’s the test code:
const els = document.querySelectorAll('a[class="nav-link"]')
assert(els.length >= 1)
As you said, that will only find elements with exactly class="nav-link"
, which I hope was not their intention.
The test code should likely be updated to query for a.nav-link
instead. I’ll file an issue on GitHub.
---
id: 587d78b0367417b2b2512b05
title: Build a Technical Documentation Page
challengeType: 14
forumTopicId: 301146
dashedName: build-a-technical-documentation-page
---
# --description--
**Objective:** Build an app that is functionally similar to <a href="https://technical-documentation-page.freecodecamp.rocks" target="_blank">https://technical-documentation-page.freecodecamp.rocks</a>
**User Stories:**
1. You can see a `main` element with a corresponding `id="main-doc"`, which contains the page's main content (technical documentation)
1. Within the `#main-doc` element, you can see several `section` elements, each with a class of `main-section`. There should be a minimum of five
1. The first element within each `.main-section` should be a `header` element, which contains text that describes the topic of that section.
1. Each `section` element with the class of `main-section` should also have an `id` that corresponds with the text of each `header` contained within it. Any spaces should be replaced with underscores (e.g. The section that contains the header "JavaScript and Java" should have a corresponding `id="JavaScript_and_Java"`)
1. The `.main-section` elements should contain at least ten `p` elements total (not each)
1. The `.main-section` elements should contain at least five `code` elements total (not each)
This file has been truncated. show original
I believe that the problem is spread to all applications, for example :
<nav id="sidebar-nav navbar"> </nav>
it is not accepted and the software does not see the navbar ID and keeps saying it is not present, but technically speaking it is present .
const el = document.getElementById('navbar')
assert(!!el && el.tagName === 'NAV')
The id
attribute can’t contain whitespace though, so that’s invalid HTML.
The id global attribute defines an identifier (ID) which must be unique in the whole document. Its purpose is to identify the element when linking (using a fragment identifier), scripting, or styling (with CSS).
Ops, you are right, thanks.
Looks like the fix went up so you can use multiple classes now, check it out!
1 Like
Thank you, problem solved
system
Closed
November 18, 2022, 7:38pm
10
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.