Step 48 Learn HTML by building a Cat Photo App

HTML-CSS
1

I am so stuck on this step

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

This is the response: est

Sorry, your code does not pass. Try again.

Hint

Both radio buttons should still be located between opening and closing label element tags.

I am not sure why it isn’t working.

2

Please post a link to the challenge and consider sharing all the code instead of just one line.

3

Hi my post didn’t display properly

4

how it won’t let me post it.

5

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 (').

6

Please edit your first post and add a link to the challenge there

7

Hi It won’t let me

It says new users are not allowed to post more than one link

and when I tried to create a new thread it said new users couldn’t post multiple links.

I have no idea what to do now.

I can’t get help and I can’t post about it!

8

If you put the code in a code block, (as described above), then it will let you post it.

9 
  <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">
     <label> <input id="indoor" type="radio" name="indoor"> Indoor </label>
              
      <label> <input id="outdoor" type="radio" name="outdoor"> Outdoor </label> 
     
          <input type="text" name="catphotourl" placeholder="cat photo URL" required>
          <button type="submit">Submit</button>
        </form>
      </section>
    </main>
  </body>
</html>```
10

hbar 1st - Thank you for your help. I have now posted my code.

1 Like
11

The code for the radio buttons has the wrong values for the name attribute.
If you check the step again it has said that the name should be set to “indoor-outdoor” I believe.

12

I also think you may have changed the spacing in the labels so to be sure that you haven’t, I suggest clicking on the reset button (the one with the arrow turning) and then adding the new name attribute this time without changing anything else.

13

Cool! Thank you hbar 1st

1 Like
14

indoor
outdoor

15

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