Learn HTML by Building a Cat Photo App - Step 61

Tell us what’s happening:
Describe your issue in detail here.

My issue is that I’m stuck. It won’t accept the way I added 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"> Indoor</label>
            <label><input id="outdoor" type="radio" name="indoor-outdoor" value="outdoor"> 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" checked> <label for="lazy">Lazy</label>
            <input id="energetic" type="checkbox" name="personality" value="energetic" > <label for="energetic"> Energetic</label>
          <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 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36

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

Link to the challenge:

The way you added the checked attribute is not wrong. But you have added it to the wrong input(s).

The instructions were to add it to the first radio button and the first checkbox

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.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

            <input id="loving" type="checkbox" name="personality" value="loving" checked> <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>

so checked at the end of the first one. I tried and it still does not work

How about the radio button?

The radio button is type= correct? Cause if that is the case ive tried adding it in front of type=" and the back and still havent gotten it correct

In order to make a checkbox checked or radio button selected by default, you need to add the checked attribute to it. There’s no need to set a value to the checked attribute. Instead, just add the word checked to the input element, making sure there is space between it and other attributes.

Make the first radio button and the first checkbox selected by default.

This right here is the problem question

I didn’t understand your previous response. I was wondering if you followed the instructions and added the checked attribute to the first radio button too?

 <input id="loving" type="checkbox"checked 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>

this code snippet is showing me that you added checkbox attribute to the first checkbox.
That is good, but you still need to add the checkbox attribute to the first radio button…

this is a radio button (in case this helps)

hello, please see the previous post. I posted the code that shows it.

 <input id="loving" type="checkbox"checked name="personality" value="loving"> checked<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>

I added “checked” on the outside of the first radio button and it still doesn’t work?

hello,

the code you’ve posted shows the checkboxes only.
Can you post what you did for the radio buttons?

i added the checked attribute between input and value like so

<input id="loving" type="checkbox"checked name="personality" value="loving"> checked<label for="loving">Loving</label>

hi, you are still showing me the checkbox code.
As I mentioned, your checkbox is fine.

Please show me the radio button code.
(the one I showed you above. It should have the checked attribute added to it)

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