type or paste code here
<header id="header">
<img id="header-img" src="https://www.greatestphysiques.com/wp-content/uploads/2018/08/Danielle-Robertson.10.jpg" alt="Girl in a jacket">
<nav id="nav-bar">
<ul>
<li><a class="nav-link" href="#Home"> Home</a></li>
<li><a class="nav-link" href="#program"> Program</a></li>
<li><a class="nav-link" href="#fitness">Fitness</a></li>
<li><a class="nav-link" href="#dbactive">DB Active</a></li>
</ul>
</nav>
</header>
<div class="sign-up-page">
</div>
<form id="form" class="sign-up-form" action="https://www.freecodecamp.com/email-submit">
<h1>Sign Up Here</h1>
<label>Email address
<input name="email" type="email" id="email" placeholder="e.x.hadeel.taleb92@gmail.com"/>
</label>
<div>
<input name="submit" type="submit" id="submit">
</div>
</form>
<div class="video-page">
<div class="video">
<iframe id="video" width="1000" height="550"
src="https://www.youtube.com/embed/ga_n2lkTKU4">
</iframe>
</div>
</div>
<div class="fitness-guide" id="fitness-guide">
</div>
Hi @hadeelAlbdairi !
When asking for help with the projects, it is always better to provide a codepen link if you can.
Also, make sure to keep the test suite on the page.
<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>
When a test fails click the red button to see which test(s) are failing and text to help you correct the issue.
Be sure and read more than just the first line of the failing message. The ability to read and comprehend error messages is a skill you’ll need to acquire as a developer. Ask questions on what you don’t understand.
This is the part of the failing message you need to read carefully.
The .nav-link with href="#Home" is not linked to a corresponding element on the page : expected null to not equal null
What the error message is telling you is that your nav links are not going to any sections on the page.
When you click on the the home link it should have a corresponding id="Home"
There should be corresponding ids for all of the nav links.
Once you do that then the test will pass.
1 Like
thanks for replying this is the code ,
i would also be grateful if u can let me know why i my li items are showing over the img i am having?
still not passing
Pay close attention to what I wrote here
I would review this lesson on linking to internal sections on the page.
The basic logic is that when I click a link like programs I should be taken to a section called programs.
When I click a link called fitness, then I would be taken to a section called fitness.
make sense?
Also as a sidenote, please do not use br tags like this.
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
I would get rid of those br tags and use css for spacing.
i have passed the tests thank you very much! can you please answer this question
i would also be grateful if u can let me know why i my li items are showing over the img i am having?
you probably have position: fixed on the items
You are passing the tests but if you click on your links, they currently don’t go anywhere on the page.
I think your misunderstanding how the concept works.
I made this pen to demostrate what I am talking about.
When you click on my nav links they go to corresponding sections on the page.
I would still review that lesson I linked earlier so you can fix that issue in your project.
As to your question about the image.
You can add a background color for the navbar.
That way, when you are scrolling, you can still read the text over the image.
I got what are you saying now!
i will check it and work on it but I have already submitted it
shall I submit the same test again after I fix it?
this is what I meant about the item is showing over the picture instead of being at its right!
thank you so much for your help
thanks a lot u were right!
1 Like
As long as you save you new work in codepen you don’t need to resubmit the same link to FCC.
1 Like
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.