Learn HTML by Building a Cat Photo App - Step 44

HTML-CSS
1

Tell us what’s happening:

Remember that an input element is a void element.

Before the text input, add a radio button with the option set as:

Indoor

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>

<!-- User Editable Region -->

        <form action="https://freecatphotoapp.com/submit-cat-photo">
    <input type="radio" name="cat-location" value="indoor" id="indoor">
    <label for="indoor">Indoor</label>
    <br>
    <input type="text" name="catphotourl" placeholder="cat photo URL" required>
   




<!-- User Editable Region -->

          <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/127.0.0.0 Safari/537.36

Challenge Information:

Learn HTML by Building a Cat Photo App - Step 44

2 Likes
2

It is not necessary to add all the name, value and id attributes. Just keep the type attribute. And look at the instructions - it says to add a radio button with the option set as: Indoor. Look at the example they gave to show the principle;

<input type="radio"> cat

That is a radio input with an option of “cat”. They want you to put a radio input with an option of “Indoor”.

You’ve got this.

Nicolas

1 Like
3

Thanks!, its still doesn’t pass.

4

Ooops, my apologies. I missed something else.

This is your code.

This is what you it looked like after you implemented my suggestion, right?

What are all these extra lines in between the two input tags? They’re not there on my project. There shouldn’t be anything in between.

<label for="indoor">Indoor</label>
   <br>

Try pressing the reset button and follow the instructions again. Let me know if it still doesn’t pass.

Sorry for the long time gap - I was reading a book :slightly_smiling_face: !

Nick

1 Like