HTML Step 64, im putting the <head> element in the correct place but its saying its wrong

HTML-CSS
1

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

  **Your code so far**


<html>
<head>
  <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" checked> 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" 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>
        </fieldset>
        <input type="text" name="catphotourl" placeholder="cat photo URL" required>
        <button type="submit">Submit</button>
      </form>
    </section>
  </main>
  <footer>
    <p>
      No Copyright - <a href="https://www.freecodecamp.org">freeCodeCamp.org</a>
    </p>
  </footer>
</body>
</head>
</html>

  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.5060.114 Safari/537.36 Edg/103.0.1264.49

Challenge: Step 64

Link to the challenge:

2

You first need to close the head tag, then move on to the body.

3

Hi,

You aren’t putting the head tag in the correctly place. You have wrapped the head element around the body element. It needs to go above it.

If you wanted to put one paragraph another you’d do it like this

<p>I am a paragraph above</p>
<p>I am a paragraph below</p>

With that in mind, how should the head element be placed?

4

See if you are actually putting the head element in right place,
be careful to see where you open an element and where you close it
look at some html examples an try to figure out what’s wrong with yours

6

thank you this helped, I was confused by putting the head element above the body element I thought it meant both elements from top to bottom.

1 Like
7

Right so,

If an element should be wrapped around another element, or an element put inside another element, the lesson will specify that.

If the lesson says to put an element above or below another element, it means to put the whole element above or below another element.

Keep those in mind and you should avoid positioning mistakes.
:smiley:

1 Like
8

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