What can I do user stories

Tell us what’s happening:

Please help me about " When I click a .nav-link button in the nav element, I am taken to the corresponding section of the landing page" user storie

https://codepen.io/Matsumoto_138/pen/gOPKBbL

Your code so far

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36.

Challenge: Build a Product Landing Page

Link to the challenge:

Welcome to the forum @demirbasfatih71.fd!

According to your Navigation, you have three separate sections to your application
Features, Filters, and About.

From what I can see currently, you have your top most section which contains

<h2 id="quick">Quick, find your PC </h2>
<form for="email" id="form" action="https://www.freecodecamp.com/email-submit">
    <input type="email" name="email" id="email" placeholder="Enter your email">
    <input type="submit" name="submit" value="Order" id="submit">
</form>

Followed by the .mid section, and then finally a .down section.

There are a couple of things that can help out with this issue.

First of all, your .nav-links do not need target="_blank" because this is a single page app. Having the target directed towards blank will open up a new page. Instead, you want your page to navigate to a section of your application.

The href="" is empty right now, but it should direct the user to that specific point in your application. This mean you need a unique ID for each section that corresponds to the nav-link. In order to target an ID, you need to direct the href to that specific ID with a hash symbol, for example href="#about"

For now, you could simply add <div class="mid" id="filters> and follow that up with <div class="down" id="about">, but in the future, it would help to rename the class to something a bit more descriptive. You may also want to contain your

<h2 id="quick">Quick, find your PC </h2>
<form for="email" id="form" action="https://www.freecodecamp.com/email-submit">
    <input type="email" name="email" id="email" placeholder="Enter your email">
    <input type="submit" name="submit" value="Order" id="submit">
</form>

inside a <div> and add a class or id to that.

There is a lot of work that could be done to this application, but you are definitely on the right track. Good luck!

Thank you very much! Finally I 've passed this challenge