# Need help with the landingpage

**URL:** <https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555>\
**Category:** Curriculum Help\
**Tags:** css, html\
**Created:** [January 19, 2021, 11:52pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555 "2021-01-19T23:52:10Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![Hureira](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hureira/32/182569_2.png) [@Hureira](https://forum.freecodecamp.org/u/Hureira)\
**Post date:** [January 19, 2021, 11:52pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/1 "2021-01-19T23:52:10Z")

</div>

Hi, i am stuck. I don’t know what i did wrong.  
It keeps telling me there is an error here

# [When I click a .nav-link button in the nav element, I am taken to the corresponding section of the landing page]

i have spent hours trying to figure it out but no luck

[https://codepen.io/hureira/pen/JjRzJqQ](https://codepen.io/hureira/pen/JjRzJqQ)

---

<div class="post-metadata">

**Author:** ![jwilkins.oboe](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jwilkins.oboe/32/179497_2.png) [@jwilkins.oboe](https://forum.freecodecamp.org/u/jwilkins.oboe)\
**Post date:** [January 20, 2021, 12:07am UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/2 "2021-01-20T00:07:22Z")

</div>

Hi @Hureira!

Welcome to the forum!

Error message  
Each .nav-link element should have an href attribute

These don’t have hrefs  
` <li class="nav-link">`

Place that class in another element that contains an href and the test will pass.

---

<div class="post-metadata">

**Author:** ![Hureira](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hureira/32/182569_2.png) [@Hureira](https://forum.freecodecamp.org/u/Hureira)\
**Post date:** [January 20, 2021, 9:46am UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/3 "2021-01-20T09:46:01Z")

</div>

Thanks, it worked…  
Decided to add the href attribute to this `<li class="nav-link">`  
making it `<li class="nav-link" href="xyzx">`

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 20, 2021, 9:47am UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/4 "2021-01-20T09:47:36Z")

</div>

that’s the wrong way of fixing it, `href`is not a valid attribute for a `li` element

---

<div class="post-metadata">

**Author:** ![Hureira](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hureira/32/182569_2.png) [@Hureira](https://forum.freecodecamp.org/u/Hureira)\
**Post date:** [January 20, 2021, 8:51pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/5 "2021-01-20T20:51:59Z")

</div>

Thanks.  
I was actually going to ask about that.  
Before i posted the question, i tried wrapping the `li` in an anchor tag, it worked fine but the test kept showing same error

---

<div class="post-metadata">

**Author:** ![Roma](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/roma/32/112899_2.png) [@Roma](https://forum.freecodecamp.org/u/Roma)\
**Post date:** [January 20, 2021, 9:42pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/6 "2021-01-20T21:42:26Z")

</div>

As @ILM pointed out, `href` is not a valid `li` attribute. The tests may pass but you have HTML syntax errors that you should correct.

Run your HTML code through the [W3C validator](https://validator.w3.org/#validate_by_input). There is a correct way to use the list item and the anchor tag together but it’s not the way you’ve chosen.

On a side note, codepen provides the boilerplate for you. It only expects the code you’d put within the `body` element in HTML. (No need to include the `body` tags). For anything you want to add to the `<head>` element click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for \<head\>’ box.

---

<div class="post-metadata">

**Author:** ![jwilkins.oboe](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jwilkins.oboe/32/179497_2.png) [@jwilkins.oboe](https://forum.freecodecamp.org/u/jwilkins.oboe)\
**Post date:** [January 21, 2021, 1:05am UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/9 "2021-01-21T01:05:39Z")

</div>

Yeah I wasn’t trying to confuse you.  
I hoping you would add it to the anchor tag instead of the li tag as suggested by this line.

> [@jwilkins.oboe](#):
>
> Place that class in another element that contains an href and the test will pass.

But maybe it wasn’t clear.

---

<div class="post-metadata">

**Author:** ![Hureira](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hureira/32/182569_2.png) [@Hureira](https://forum.freecodecamp.org/u/Hureira)\
**Post date:** [January 21, 2021, 2:01pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/10 "2021-01-21T14:01:18Z")

</div>

[quote=“Roma, post:6, topic:441555, full:true”]

> [@](#):
>
> As @ieahleen pointed out, `href` is not a valid `li` attribute. The tests may pass but you have HTML syntax errors that you should correct.
> 
> Run your HTML code through the [W3C validator](https://validator.w3.org/#validate_by_input). There is a correct way to use the list item and the anchor tag together but it’s not the way you’ve chosen.

Thank you. I will check the W3C Validator

> [@](#):
>
> On a side note, codepen provides the boilerplate for you. It only expects the code you’d put within the `body` element in HTML. (No need to include the `body` tags). For anything you want to add to the `<head>` element click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for \<head\>’ box.

I used a vscode to write the code and only copied it into the codepen. Thanks though, i didnt know i could use the settings button that way

---

<div class="post-metadata">

**Author:** ![Hureira](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hureira/32/182569_2.png) [@Hureira](https://forum.freecodecamp.org/u/Hureira)\
**Post date:** [January 21, 2021, 2:02pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/11 "2021-01-21T14:02:28Z")

</div>

> [@jwilkins.oboe](#):
>
> Yeah I wasn’t trying to confuse you.  
> I hoping you would add it to the anchor tag instead of the li tag as suggested by this line.
> 
> > [@jwilkins.oboe](#):
> >
> > Place that class in another element that contains an href and the test will pass.
> 
> But maybe it wasn’t clear.

I tried that but the error kept coming up

---

<div class="post-metadata">

**Author:** ![Hureira](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hureira/32/182569_2.png) [@Hureira](https://forum.freecodecamp.org/u/Hureira)\
**Post date:** [January 21, 2021, 2:13pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/12 "2021-01-21T14:13:40Z")

</div>

wow, the validator is good. Thanks

---

<div class="post-metadata">

**Author:** ![Hureira](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hureira/32/182569_2.png) [@Hureira](https://forum.freecodecamp.org/u/Hureira)\
**Post date:** [January 21, 2021, 8:39pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/14 "2021-01-21T20:39:14Z")

</div>

![landingpagesnip](https://global.discourse-cdn.com/freecodecamp/original/3X/2/7/27ca7ff9bb6cbd32cc4825767fc0cb0b9c37b414.jpeg)

please check this. Is there a mistake there? Its still showing same error

---

<div class="post-metadata">

**Author:** ![jwilkins.oboe](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jwilkins.oboe/32/179497_2.png) [@jwilkins.oboe](https://forum.freecodecamp.org/u/jwilkins.oboe)\
**Post date:** [January 21, 2021, 8:44pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/15 "2021-01-21T20:44:34Z")

</div>

Oh I am an idiot.  
I ignored my own advice. 😆

I should have placed the class in the anchor tag from the deleted screenshot earlier.

```auto
  <li>
          <a class="nav-link" href="#email-submit">SUBSCRIBE</a>
  </li>

```

That’s what the test means by clickable element.

Codepen must have not registered the change I made earlier and allowed the test to pass when it wasn’t supposed to.

Now it should pass and it is syntactically correct.

---

<div class="post-metadata">

**Author:** ![Hureira](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hureira/32/182569_2.png) [@Hureira](https://forum.freecodecamp.org/u/Hureira)\
**Post date:** [January 21, 2021, 8:58pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/16 "2021-01-21T20:58:20Z")

</div>

Thanks. Its fixed. That worked

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [October 17, 2021, 6:25pm UTC](https://forum.freecodecamp.org/t/need-help-with-the-landingpage/441555/17 "2021-10-17T18:25:00Z")

</div>


