Why is it doing this?!

Why are my stupid nav-items under my h3 element?


Mind you, I am not even close to done on this random project so it really isn’t time for feedback but please help with the above question. Thank you!

you better start fixing your html coding structure,
to many errors.
it could be because of that.

1 Like

Because of the height on the header.

1 Like

Thank you so much! i got it now. I changed it to 10rem instead of 5rem.

I will of course be improving everything. i am in the very early stages of this webpage.

something like this

 <ul class="nav-list">
        <div class="menu-icons close">
        <i class="icon ion-md-close"></i>
        <div class="cta">
          <a href="#" class="btn">Join Our Community   
        <li class="nav-item">
          <a href="#" class="nav-link">Home
1 Like

Why do I now have two “join our community” links?


I am copying from a youtube video right now. After the video is through, I am going to customize the page and make it my own but even though I am copying this man’s work exactly. It’s not working out the same at all!

Because you have the link twice in the HTML (Line: 30 and 66).

  1. Your URL for the fonts is not correct, it should be:
<link href="https://fonts.googleapis.com/css2?family=Nunito&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Aldrich&display=swap" rel="stylesheet">

Or combined into one link:

<link href="https://fonts.googleapis.com/css2?family=Aldrich&family=Nunito&display=swap" rel="stylesheet">
  1. You have an incomplete URL for Bootstrap in the settings and it’s an old version. Should be.


  1. Your universal selector is broken. Should be.
*:: before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: inherit;
  1. You have a nav-list selector, it should be a class selector .nav-list. The same for menu-icons it should be a class .menu-icons.

  2. The cta div in the nav-list ul is unclosed.

Page with the corrections (will delete when you are done with it)
Edit: deleted https://codepen.io/lasjorg/pen/jOWNOpa

1 Like

Thank you very much. I will start fixing everything right now. :+1:

My hero! Thank you very much! It is fixed!

1 Like

No problem, happy to help.

I will delete my Codepen, you are done with it right?

1 Like

Yes, I think I am done with it. Thank you. :slightly_smiling_face:

wait, wait, wait! I am a perfect idiot! Did that correction page you made show me how to get rid of the double “join our community” link?

No, because I have no way of knowing which one you want and which one you don’t want.

Surely you can just delete the one you don’t want?

I don’t even know how the extra one got there! I don’t want the one that is my navbar.

Well, then delete it from the HTML.

1 Like

Thank you, i got it figured out. Earlier I had been fiddling and experimenting out of curiosity with my code and I added double without paying attention. Duh! It’s all my fault. Thank you for making my silly brain click.

1 Like

Hey, since I see a lot of people saying you have errors in your code, try using this tool a lot more : W3C Validator. It’s a useful tool that will go through your code and validate it, if there is some error, it will tell you.
NOTE: If you use CodePen, always ignore the first 2 errors

1 Like

Thank you very much! But how do I use that?

If you have an HTML file (It usually ends with .html), you can upload a file there. If you use CodePen, which you are, then copy and paste your code into the Validate by Direct Input Like this screenshot:

1 Like