Learn HTML by Building a Cat Photo App - Step 66

HTML-CSS
1

**Tell us what’s happening:**I keeps telling me the link should be freecodecamp.org

Describe your issue in detail here. i just tried but could not find someone with similar issue

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>No Copyright - freeCodeCamp.org<a href="https://www.freecodecamp.org"></a></p>
    </footer>
  </body>
</html>

Your mobile information:

octopus - Android 13 - Android SDK 33

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

Hi @s1lverlin3175

The link’s text should be freeCodeCamp.org . You have either omitted the text or have a typo.

The link text in not nested in the anchor element.

Happy coding

1 Like
4

Hey Buddy Can you describe your issue in your own words ?

5

well i have a problem when adding the href attribute the code just turns white i don’t understand why

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

i even tried

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

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.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

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

7

the “No copyright” part doesn’t go in the a element. You also need to make sure to write complete tags, your opening a tag is incomplete in both snippets

also you should not change the order of the text you have

you may need to reset the step, then add the a element around the text you are instructed to transform into a link

8

i reset and tried your advice but it told me
Your anchor (a) element should have an href attribute with the value https://www.freecodecamp.org. You may have omitted the attribute/value, or have a typo.

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

Attributes can’t float around outside of tags.

10

i appreciate your patience but could you give me more of a hint please

11

What Jeremy says, and you also lost the dash after “No Copyright”

12

the attribute has to go inside the opening tag, like all attributes

13 
type or paste code here
 <p>No Copyright - <a href="https://www.freecodecamp.org"freeCodeCamp.org</a></p>


like this?
14

again i really appreciate your patience
i have been stuck on this since yesterday and i started a couple of days ago this is the longest i got stuck on a level

1 Like
15

Every tag still must have a < and a >

16

it did not work im sorry i should watch a youtube video sorry i feel like im wasting your time

17

**Tell us what’s happening:**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.
Describe your issue in detail here. i went to my previous element with href attribute and followed what i did there and it came up with this and when i added spacing it told me the link was missing

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"> freeCodeCamp.org</a> No Copyright -</p>
    </footer>
  </body>
</html>

Your mobile information:

octopus - Android 13 - Android SDK 33

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

Link to the challenge:

18

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!

19

Hi @s1lverlin3175

Try placing the text before the link text.

image
image1219×194 17.9 KB

Happy coding

20

No worries i found the solution sometimes looking at the past helps us with future while adding slight modifications to fit the problem