Learn HTML by Building a Cat Photo App - Step 46

HTML-CSS
1

Either the INSTRUCTIONS on the page are wrong or the CHALLENGE doesn’t accept the correct answer. The insturctions say " Step 46

You can use radio buttons for questions where you want only one answer out of multiple options.

Here is an example of a radio button with the text set as cat:

Example Code

<input type="radio"> cat

Remember that an input element is a void element.

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

Indoor

My input matched the instuctions:

<input type="radio"> Indoor

What’s the deal, please???

2

Hello, @EdNewbold and welcome to the forum.

This website https://www.w3schools.com/tags/att_input_type_radio.asp, might be able to help you figure out your solution.

Hope you can figure out your solution!!

3

@EdNewbold Paste your code here, it should pass with what you have shown so far. Maybe there is another error. If you paste what you have completely then I could help you better.

4

For some reason, the forum reply function wouldn’t let me post the code. Something about new user limitations. Any suggestions?

5

I have double-checked the before and after code (it all passed the site’s verification process), so I’m guessing that the web site owners have broken it somehow, (sigh…), No joy here tonight. Very frustrating.

6

Welcome to the forum @EdNewbold

So the forum can assist please post your full code.

Use the following method to post code to the forum:

  1. On a separate line type three back ticks.
  2. On a separate line paste your code.
  3. On the last line type three back ticks. Here is a single back tick `

Happy coding

7 
<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">
      <input type="radio"> Indoor
          <button type="submit">Submit</button>

        </form>
      </section>
    </main>
  </body>
</html>
8

The line that reads:

<input type="radio"> Indoor

is the line that won’t validate.

Thank you,
Ed Newbold

9

Hi @EdNewbold

Here is a comparison of the original code and your code.

The code in blue is the original code, the code in red is your code.
The code in magenta is the overlap.

image
image898×205 13.5 KB

It looks like an input element went missing.
Please reset the step to restore the seed code and try again.

Happy coding

10

OK. I did a “reset” as you suggested, and now it validates. Very strange, but at least I can continue now. Thank you.

2 Likes