Learn HTML by Building a Cat Photo App - Step 66

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
Dear members I get the error below. What am I doing wrong?The link’s text should be freeCodeCamp.org. You have either omitted the text or have a typo.
Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <section>
        <h2>Cat Photos</h2>
        <p>Everyone loves <a href="https://cdn.freecodecamp.org/curriculum/cat-photo-app/running-cats.jpg">cute cats</a> online!</p>
        <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>
    <p><a href="https://www.freecodecamp.org">No Copyright - freeCodeCamp.org</a></p>
    </footer>
  </body>
</html>

Your mobile information:

SNE-LX1 - Android 10 - Android SDK 29

Challenge: Learn HTML by Building a Cat Photo App - Step 66

Link to the challenge:

2

You appear to have created this post without editing the template. Please edit your post to Tell us what’s happening in your own words.
Learning to describe problems is hard, but it is an important part of learning how to code.
Also, the more you say, the more we can help!

3

Turn the existing freeCodeCamp.org text into a link

Read that again carefully. Is that the text you turned into a link?

4

Dear forum member,

I’m stuck on step 66 of the FreeCodeCamp HTML challenge “Learn HTML by Building a Cat Photo App”. The error message I’m getting seems contradictory.

I have tested both options:

  1. Making the entire text “No Copyright - freeCodeCamp.org” clickable. → Error message: “The link’s text should be freeCodeCamp.org. You have either omitted the text or have a typo.”
  2. Making only “freeCodeCamp.org” clickable. → Error message: “The entire sentence should be inside the link.”

The error message keeps switching depending on the adjustment I make. It seems like something else is causing the issue, or the error message might not be reliable.

I have already reset my cache, but the problem persists. Has anyone experienced this before or found a solution?

Thanks in advance!

5

Hi,
the whole text shouldnt be inside the anchor tag. Reset the step and try adding only freeCodeCamp.org inside the tags, and be careful about not changing anything else.

6

Dear forum members,

I have completed the task as instructed, but I still receive the following error message:

“After nesting the anchor (a) element, the only p element content visible in the browser should be No Copyright - freeCodeCamp.org. Double check the text, spacing, or punctuation of both the p and nested anchor element.”

I have tried both options: one where only freeCodeCamp.org is inside the <a> tag and another where No Copyright - freeCodeCamp.org is inside the <p> tag with the link nested inside. However, the error message keeps appearing.

Does anyone have an idea what might be going wrong?

7

Please show what your code looks like now.

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.

entering-code-example
entering-code-example1356×380 401 KB

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

8

Question for the forum:

"I have a problem with the following task:

After nesting the anchor () element, the only

element content visible in the browser should be: “No Copyright - freeCodeCamp.org”. Double check the text, spacing, or punctuation of both the

and nested element.

The issue is that if I put only “freeCodeCamp.org” inside my element, I get an error saying that “No Copyright” also needs to be displayed. But if I put “No Copyright - freeCodeCamp.org” inside my

element and “freeCodeCamp.org” inside my element, I get an error saying that only “freeCodeCamp.org” should be visible.

What am I doing wrong? How should the code be correct?"

My code so far:


<p>No Copyright - <a href="https://www.freecodecamp.org">freeCodeCamp.org</a></p>  
\```  
---
9

My code so far:


<p>No Copyright - <a href="https://www.freecodecamp.org">freeCodeCamp.org</a></p>  
\```  
---
10

Hi,
Try reseting this step and add your anchor tags again. Don’t add these:

\```  
---

Good luck!

11

I only used the backticks to indicate where the problem lies in my code, but here is the actual code without the backticks. The issue is located there, and I would like help solving it.

I have a problem with the following task:

After nesting the anchor () element, the only

element content visible in the browser should be: ‘No Copyright - freeCodeCamp.org’. Double check the text, spacing, or punctuation of both the

and nested element.

The issue is that when I use the following code:

No Copyright - freeCodeCamp.org

If I put only “freeCodeCamp.org” inside the element, I get an error saying that “No Copyright” also needs to be displayed. But if I put “No Copyright - freeCodeCamp.org” inside my

element and “freeCodeCamp.org” inside my element, I get an error saying that only “freeCodeCamp.org” should be visible.

What am I doing wrong? How should the code be correct?

12

Did you try resetting the step?

13

Press the reset button and enter your code.

14

Thanks for your help! I modified the code and it works perfectly now. Really appreciated!

1 Like