Step 55 need help

I have tried this many different ways, don’t know what I am doing wrong

  **Your code so far**

<html>
<body>
  <h1>CatPhotoApp</h1>
  <main>
    <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"> <label for="Loving"></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/101.0.4951.67 Safari/537.36

Challenge: Step 55

Link to the challenge:

You should have “Loving” as the text between the opening and closing tags while the for attribute is set to id value of the input element to the left.

Here is my code now <input id="loving" type="checkbox"><label Loving ></label>
It did not pass, The text Loving should no longer be located directly to the right of your checkbox. It should be wrapped in a label element. Make sure there is a space between the two elements.

1 Like

You now have the text “Loving” floating around inside of the opening tag and no ‘for’ attribute. That won’t work.

You need to

  1. Put “Loving” between the opening and closing tag

  2. Put the for attribute back in the opening tag and use the id attribute value from this element:

I appreciate your help and patience, I am having a hard time understanding this.
Here is the code now.
<input id="loving" for="Loving" type="checkbox"><label"Loving"></label>
It did not pass, The text Loving should no longer be located directly to the right of your checkbox. It should be wrapped in a label element. Make sure there is a space between the two elements.

Right here, you have the text “Loving” just floating around inside of here. It isn’t doing anything for you.

This text needs to go in between the opening and closing label tags.

This in an opening tag: <tag>
This is a closing tag: </tag>


Also, you need to put the for attribute back on the opening label tag. You had it here:

but it is set to the wrong value. It needs to be set to the exact same value, with the exact same capitalization as the id attribute here:

Code,
<input id="loving" type="checkbox"><label for="loving">Loving</label>

The text Loving should no longer be located directly to the right of your checkbox. It should be wrapped in a label element. Make sure there is a space between the two elements.

I’ve edited your post 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.

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

It doesn’t look like you have a space between the two elements.

1 Like

Jeremy,
Thank you for sticking with me and helping me through this.
With your help I was able to pass this step

2 Likes

Mod Edit: SOLUTION REMOVED

It is great that you solved the challenge, but instead of posting your full working solution, it is best to stay focused on answering the original poster’s question(s) and help guide them with hints and suggestions to solve their own issues with the challenge.

We are trying to cut back on the number of spoiler solutions found on the forum and instead focus on helping other campers with their questions and definitely not posting full working solutions.

I am stuck on the same step, cant figure out what I am doing wrong here


<input id="loving" type="checkbox"> loving> <label for="loving">loving</label>

Any suggestions?

If you have a question about a specific challenge as it relates to your written code for that challenge, just click the Ask for Help button located on the challenge. It will create a new topic with all code you have written and include a link to the challenge also. You will still be able to ask any questions in the post before submitting it to the forum.

Thank you.

delete you (loving>) this text after checkbox

I think there’s a problem with step 55 of the course.

It doesn’t work:

<input id="loving" type="checkbox"><label for="loving">Loving</label>

But this works perfectly:

<input id="loving" type="checkbox"> <label for="loving">Loving</label>

All that has changed is the space between the input and the label elements.
(By the way I’m also a beginner, so I wouldn’t know if this is how it’s supposed to work, but there’s no clear indication for me of the importance of a space between elements).

1 Like

There is a reason for that.
Look at the preview for the first solution you provided.
Compare it with the preview for the second one.

Page will look defferently, look at the checkbox and text to catch the differnce.

1 Like

(post deleted by author)

I understand there’s a difference of one space. But I was stuck for several minutes before casually finding out what should be done in step 55.

Is the space after the checkbox so important?

Well, usually checkboxes and text, associated with them, are separated a little bit.
To build pages where is no space between parts of content at all - I guess that’s not the best idea.

I was stuck for 3 hours today with some Javascript stuff, it’s not the end of the world :upside_down_face:

1 Like