Learn HTML by Building a Cat Photo App - Step 61

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
can someone tell me what I did wrong here?
Is your cat an indoor or outdoor cat?
Indoor
<input id=“outdoor” type=“radio” name=“indoor-outdoor” value=“outdoor"checked=”"> Outdoor
The hint is-
The second radio button should not have the checked attribute.

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">
          <fieldset>
            <legend>Is your cat an indoor or outdoor cat?</legend>
            <label><input id="indoor" type="radio" name="indoor-outdoor" value="indoor" checked=""> Indoor</label>
            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"checked="">  Outdoor</label>
          </fieldset>
          <fieldset>
            <legend>What's your cat's personality?</legend>
            <input id="loving" type="checkbox" name="personality" value="loving"> <label for="loving">Loving</label>
            <input id="lazy" type="checkbox" name="personality" value="lazy"> <label for="lazy">Lazy</label>
            <input id="energetic" type="checkbox" name="personality" value="energetic"> <label for="energetic"> Energetic</label>
          </fieldset>
          <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/106.0.0.0 Safari/537.36 OPR/92.0.0.0

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

Link to the challenge:

2

Your second radio button is checked but should not be.

3

you have modified the Indoor and Outdoor radio buttons.
They only wanted the first one to be modified.

The other mistake is the way you wrote the checked attribute.
The checked attribute does not have any value so you should erase the equal sign and the double quotes you added to it

4

The instruction: “Make the first radio button and the first checkbox selected by default.”
The first ‘input’ element with ‘type’ set to ‘radio button’ and the first ‘input’ element’ with ‘type’ set to ‘checkbox’ should have ‘checked’ attributes added.

5

I corrected it like this:

<input id=“indoor” type=“radio” name=“indoor-outdoor” value="indoor"checked> Indoor

and it writes
The first checkbox is missing the checked attribute.

6

Please read what I have posted above!

7

that is great. Now all you have to do is the exact same thing to the first checkbox

8

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