Build a Cat Photo App - Step 37

HTML-CSS
1

Tell us what’s happening:

I’m having difficulties in advancing from this stage. I need help advancing please.

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>catnip</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>
    </main>
    <footer>

<!-- User Editable Region -->

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

<!-- 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/139.0.0.0 Safari/537.36 Edg/139.0.0.0

Challenge Information:

Build a Cat Photo App - Step 37

2

do you remember how to create a link in html?
What steps are involved?

Here’s an article that may jog your memory:

1 Like
3

The concept you seem to be stumbling over is how tags work. When you have <a>freeCodeCamp.org</a> and then <a href="https://www.freecodecamp.org."</a> next to it, the browser is going to look at that as two separate things even though they are inside of the <p></p> elements.

4

Hi Buddy, See here you’re instructed to make freeCodeCamp.org a link so you need to wrap this inside an anchor tag.

Here you need to learn that how to wrap any word inside and anchro tag See example is in the given below.

<p>This is the paragraph <a href="link address">This is the text.</a> we're using it for example</p>

Now in your code you have closed the anchor tag after the text, So kindly do remove it , And you can see how my example is then you will be able to see this.

Hope You Understand.

1 Like
5

Let me go try it out. Thank you so much, you guys are amazing here.

1 Like
6

Awesome! I guess a little help was all I needed, thank you so much.

1 Like