Product landing/page

HTML-CSS
1

its telling me that my nav links arent right and i cant figure out why here is the code

<!DOCTYPE html>
<html>
  <body>
    <header id="meta">
      <meta id="meta">
      <link href="styles.css">
      <h1>helloworld</h1>
    </header>
    <main id="main-doc">
      <div class="container">
        <section class="main-section" id="first">
          <header id="first">
            <p>d</p>
          </header>
        </section>
        <section class="main-section" id="second">
          <header id="second">
            <p>1</p>
          </header>
        </section>
        <section class="main-section" id="third">
          <header id="third">
            <p>p</p>
          </header>
        </section> 
        <section class="main-section" id="fourth">
          <header id="fourth">
            <p>j</p>
          </header>
        </section>
        <section class="main-section" id="fifth">
          <header id="fifth">
            <p>h</p>
          </header>
        </section>
      </div>
    </main>
    <footer>
    </footer>
  </body>
</html>
2

Hey there :wave:

Could you share a link to the lesson? I can’t get the curriculum to come up at the moment (I did see a notice about that earlier), but maybe I can get to the lesson if you have the link to it.

What exactly is it saying is wrong? The links themselves look right, but I’m guessing there’s some small detail about it that’s not passing. For example, “Must be the child of such and such.”

1 Like
3

https://www.freecodecamp.org/learn/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page here it is

4

this is exactly what its saying Each .nav-link element should link to a corresponding element on the landing page (has an href with a value of another element’s id. e.g. #footer )

5

the input for email also dosent show up and i have no clue why but it passes the test

6

Phew that took me longer than it should have to see :laughing:

Before you edited the post did you have your <nav> inside of <head> as opposed to <header>? I copied over to another IDE and got <head> which would be why that wasn’t passing.
<head> is meant for things like metadata, not actual page content.

As for your email input, remember <video> is not a self closing tag :wink:

An extra point is that <body> just encompass all visible content on your page, so <header> and <footer> should be nested in it.

1 Like
7

so switch header with head?

8

now the navbar ist at the top of the view port do u know how to fix that?

9

No you’re right now, header is right, head would be wrong.

I’d probably use position: sticky; or position: fixed;.

1 Like
10

it is position fixed

#nav-bar {
  position: fixed;
  width: 100%;
}
11

but it still doesnt work

12

nvm i fixed
need to make it 20 charecters

1 Like
13

:tada:

Mind if I ask, was it because the image was above nav-bar?

1 Like
14

it was
need to make it 20 charecters

1 Like
15

Header and footer need to be inside the body. Right now they aren’t.

16

Hi All, From the moment a user reaches your landing page, a timer goes off. You’ve got roughly 15 seconds to convince your user this is where they want to be. Read the complete article here Building landing pages: A sneak peak behind our process.

Hope it will help you out in learning landing pages.

17

incorrect’
they are in the right spot

18

i just forgot to update the code :sweat_smile:

19

Regularly adding this to your posts is a little bit odd. The 20 character minimum is there to encourage users to make longer, more thoughtful replies.

20

ok sorry i didnt know that i just run into that problem alot i agree it does sound really weird