Learn HTML by Building a Cat Photo App - Step 64

Tell us what’s happening:

Hello everyone,
I am stuck on step 64. I used the a attribute and the href. After that, I put a name which =“freecodecamp.org” I closed the p and a tag with closing tags. Can someone help me understand where I went wrong?

Thank you,
Jonathan

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <section>
        <h2>Cat Photos</h2>
        <!-- TODO: Add link to cat photos -->
        <p>See more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a> in our gallery.</p>
        <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
      </section>
      <section>
        <h2>Cat Lists</h2>
        <h3>Things cats love:</h3>
        <ul>
          <li>cat nip</li>
          <li>laser pointers</li>
          <li>lasagna</li>
        </ul>
        <figure>
          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
          <figcaption>Cats <em>love</em> lasagna.</figcaption>  
        </figure>
        <h3>Top 3 things cats hate:</h3>
        <ol>
          <li>flea treatment</li>
          <li>thunder</li>
          <li>other cats</li>
        </ol>
        <figure>
          <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
          <figcaption>Cats <strong>hate</strong> other cats.</figcaption>  
        </figure>
      </section>
      <section>
        <h2>Cat Form</h2>
        <form action="https://freecatphotoapp.com/submit-cat-photo">
          <fieldset>
            <legend>Is your cat an indoor or outdoor cat?</legend>
            <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked> Indoor</label>
            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> Outdoor</label>
          </fieldset>
          <fieldset>
            <legend>What's your cat's personality?</legend>
            <input id="loving" type="checkbox" name="personality" value="loving" checked> <label for="loving">Loving</label>
            <input id="lazy" type="checkbox" name="personality" value="lazy"> <label for="lazy">Lazy</label>
            <input id="energetic" type="checkbox" name="personality" value="energetic"> <label for="energetic">Energetic</label>
          </fieldset>
          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
          <button type="submit">Submit</button>
        </form>
      </section>
    </main>
    <footer>

<!-- User Editable Region -->

      <p><a href="https://www.freecodecamp.org"type="freeCodeCamp.org"</p></a>

<!-- User Editable Region -->

    </footer>
  </body>
</html>

Your browser information:

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

Challenge Information:

Learn HTML by Building a Cat Photo App - Step 64

Hello!

Let’s take a closer look to your production for the task:

<p><a href="https://www.freecodecamp.org"type="freeCodeCamp.org"</p></a>

There’s a few problems here:

  1. Your opening <a> tag with the attributes isn’t closed (look carefully just before the closing </p> tag, you’re missing a >
  2. One of the rules of nesting HTML elements is “first opened, last closed”, try to see how you missed that in this line of code and fix it :slight_smile:

Wishing you the best of luck!

3 Likes

Thank you for the reply @Losarig . Your explanation is very easy to understand but for some reason, I’m still getting an error. I looked at the

tag and put an a> after it but maybe I’m still misunderstanding.

Thank you!!

2 Likes

You’re very welcome!
Would you please consider sending me your current code so I can understand what the new issue is?
Thank you !

Yes! Of course!
<p> <a href="https://www.freecodecamp.org">freeCodeCamp.org></a></p>
I hope this helps!

1 Like

I could use the whole line that is in between the 2 User Editable Region comments please :slight_smile: this would be more helpful!

1 Like

How do you do that? Sorry, I’m such a noob.

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

1 Like

Okay,

You successfully closed your <a> opening tag which is great, and used freeCodeCamp.org as the link content. Now it seems like there’s a parasite “>” after the content of your link.

Let’s make a quick refresher about HTML elements:
HTML elements (for a big part of them) have an opening tag, <p> for example and a closing tag, which would, in our case, be </p>.
What’s in between is the content of our element, we could for example put some text in here, like <p>Hello, World!</p>.
The anchor element works the same, is has an opening AND a closing tag, and it can take content which will be what is displayed as the link on the screen.

Your task says:

Turn the existing freeCodeCamp.org text into a link by enclosing it in an anchor (a ) element. The href attribute should be set to https://www.freecodecamp.org .

I think using my explanations and reading the task one more time, you can do it now! You got this!

Thank you. It’s still giving me an error. :frowning:

Hello there!

Making any progress on your task ?

No, unfortunately. I’ve been stuck on the task for a while now.

<p> <a href="https://www.freecodecamp.org">freeCodeCamp.org></a></p> remove the aero located with freecodecamp.org text . And space after opening P tag.

Thank you for the explanation. I removed the arrow and put a space between the opening p tag. I’m wondering if there’s just an error on the other end because I’ve tried everything that each person in this post has recommended.

1 Like

Show your code now il, I will see. @jpccdirect

No problem! I apologize. It could be I’m making an error without realizing it but I’m almost positive I did it right.
<p> <a href="https://www.freecodecamp.org"freeCodeCamp.org ></a></p>

1 Like

Buddy you removed wrong aero > put that aero back with org and remove another one located with the closing anchor tag. Also remove space between the opening P aero and opening a areo.

If error occurred next time, copy paste your code to chatgpt and say correct it. Chatgpt will correct it.

Heads up. We discourage the use of chatGPT. One, it can be wildly inaccurate, and when you get further in the lessons and start working on the projects the code must be your own. Using ChatGPT in projects goes against the Academic honesty policy. Again, this is just a challenge and not a project but fair warning on using chatGPT

Reset the lesson. You are missing the text “No - copyright” and resetting will get everything back in the right place.

1 Like

I tried that. I reset it, redid the code, and didn’t use chatgpt. I still don’t know what I am doing wrong. Also, thank you for your reply.