Learn HTML by Building a Cat Photo App - Step 48

HTML-CSS
1

Tell us what’s happening:
I am stuck again. As a visual learner an aspect of the course I find hard is to follow written instructions that don’t specify the format, I have tried various different versions of spaces, etc and don’t understand where I am going wrong? I have looked at previous posts and know others have struggled with this but I have tried using ‘input’ tags and get the same error?

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>
        <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">

<!-- User Editable Region -->

          <label><input id="indoor" type="radio"> <input name="indoor-outdoor">Indoor</label>
          <label><input id="outdoor" type="radio"> <input name="indoor-outdoor">Outdoor</label>

<!-- User Editable Region -->

          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
          <button type="submit">Submit</button>
        </form>
      </section>
    </main>
  </body>
</html>

Your browser information:

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

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

Link to the challenge:

2

Add the name attribute with the value indoor-outdoor to
both existing radio buttons.

The problem with your code is; you created a new input element the label element, for which you’re not supposed to do that.

Reset your code and just add the name attribute with it value in both the existing input element and run. I think this might help.

3

Screenshot (1)
Screenshot (1)1127×819 69.1 KB

Thank you for your advice, I think I have done as you (and the instructions!) suggested but I am now back to the original error message. I have attached a screenshot- don’t understand where I am going wrong with it?! Thank you.

4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.