Learn HTML by Building a Cat Photo App - Step 44

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
I cant seem to figure this one out. The directions seem clear and still isnt working. The tip tells me " The radio button’s Indoor text should be located after it instead of before it."

Indoor: indoor

I mimiced the cat example to a T and still says needs to be moved. When I move it then it tells me exact opposite. So I just go back and forth.

Was this portion done right?
///Indoor: indoor ///

Where does it go since not in front?

The directions for this section doesn’t seem to be that clear since I need to ask help. OR the wording is wrong.

Your code so far

<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <section>
        <h2>Cat Photos</h2>
        <!-- TODO: Add link to cat photos -->
        <p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</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">
Indoor:<input type="radio"> indoor
          <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/107.0.0.0 Safari/537.36

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

Link to the challenge:

2

currently stuck here: Indoor: indoor

^^ idk why it didnt show this when I made the post. I pasted this into my initial post and seems like it didnt copy it correctly. Maybe the slashes messed it up.

3

compare your code to the cat example:
<input type="radio"> cat

These two are not exactly the same.

I think what happened is that you thought the cat: is part of the example?
(it isn’t , it is part of the introduction to the example, but I understand the confusion)

4

Hello,

I figured it out by looking at someones project on section 46. Ya the directions on this one def should be updated. Here is why.

First of all you need an ID and you also need to not do exactly what the example says and put the cat: part.

Here is an example of a radio button with the option of cat : <input type="radio"> cat . Remember that input elements are self-closing.

^^ " cat: " throws you off. ^^ Also no mention of using " ID ". Me being a rookie mentioning the “ID” attribute would def help me or at least remind me to use it. I’m guessing it is called an attribute fyi.
Thank you for your time and your help.

5

which code did you end up using? you definitely do not need an id for this step. (try without it)

6

Yes, it worked. Ya I got ahead of myself with the ID.

7

Thanks again for the help.

1 Like
8

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