Need help with the <hr> element for step 66

HTML-CSS
1

I had put hr element between the header and the main element. I feel that my code is correct but why is the error showing … I appreciate if someone help.

My code soo far…

Cafe Menu

CAMPER CAFE

Est. 2020

<main>
  <section>
    <h2>Coffee</h2>
    <article class="item">
      <p class="flavor">French Vanilla</p><p class="price">3.00</p>
    </article>
    <article class="item">
      <p class="flavor">Caramel Macchiato</p><p class="price">3.75</p>
    </article>
    <article class="item">
      <p class="flavor">Pumpkin Spice</p><p class="price">3.50</p>
    </article>
    <article class="item">
      <p class="flavor">Hazelnut</p><p class="price">4.00</p>
    </article>
    <article class="item">
      <p class="flavor">Mocha</p><p class="price">4.50</p>
    </article>
  </section>
  <section>
    <h2>Desserts</h2>
    <article class="item">
      <p class="dessert">Donut</p><p class="price">1.50</p>
    </article>
    <article class="item">
      <p class="dessert">Cherry Pie</p><p class="price">2.75</p>
    </article>
    <article class="item">
      <p class="dessert">Cheesecake</p><p class="price">3.00</p>
    </article>
    <article class="item">
      <p class="dessert">Cinnamon Roll</p><p class="price">2.50</p>
    </article>
  </section>
</main>
<footer>
  <p>
    <a href="https://www.freecodecamp.org" target="_blank">Visit our website</a>
  </p>
  <p>123 Free Code Camp Drive</p>
</footer>

  <footer>
    <p>
      <a href="https://www.freecodecamp.org" target="_blank">Visit our website</a>
    </p>
    <p>123 Free Code Camp Drive</p>
  </footer>
</div>

error:

Test

Sorry, your code does not pass. Hang in there.

Hint

Your hr element should be between your p element and your section element.

Pls HELP!!

1 Like
2

Next time when you post a thread on the forum don’t edit the default area where the code and link for the lesson is placed.

You can describe your issue at the given space. Below is how to edit your text into the code which you have formatted.

I need to see your full code especially before this part. Because that is where the steps should take place

3

ok … got it …

Here you goo the code :

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Cafe Menu</title>
  <link href="styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
  <div class="menu">
    <header> 
      <h1>CAMPER CAFE</h1>
       <p class="established">Est. 2020</p>
       <hr>
    </header>
      
    <main>
      <section>
        <h2>Coffee</h2>
        <article class="item">
          <p class="flavor">French Vanilla</p><p class="price">3.00</p>
        </article>
        <article class="item">
          <p class="flavor">Caramel Macchiato</p><p class="price">3.75</p>
        </article>
        <article class="item">
          <p class="flavor">Pumpkin Spice</p><p class="price">3.50</p>
        </article>
        <article class="item">
          <p class="flavor">Hazelnut</p><p class="price">4.00</p>
        </article>
        <article class="item">
          <p class="flavor">Mocha</p><p class="price">4.50</p>
        </article>
      </section>
      <section>
        <h2>Desserts</h2>
        <article class="item">
          <p class="dessert">Donut</p><p class="price">1.50</p>
        </article>
        <article class="item">
          <p class="dessert">Cherry Pie</p><p class="price">2.75</p>
        </article>
        <article class="item">
          <p class="dessert">Cheesecake</p><p class="price">3.00</p>
        </article>
        <article class="item">
          <p class="dessert">Cinnamon Roll</p><p class="price">2.50</p>
        </article>
      </section>
    </main>
    <footer>
      <p>
        <a href="https://www.freecodecamp.org" target="_blank">Visit our website</a>
      </p>
      <p>123 Free Code Camp Drive</p>
    </footer>
  </div>
</body>
<html>
     
      <footer>
        <p>
          <a href="https://www.freecodecamp.org" target="_blank">Visit our website</a>
        </p>
        <p>123 Free Code Camp Drive</p>
      </footer>
    </div>
  </body>
</html>
4

Why there is header element in your code?

I believe there is no steps in this lesson that use header element.

Restart your lesson adjust the hr element as the instruction asked.

5

yes !! it worked … Thank You!!

<main>
        <h1>CAMPER CAFE</h1>
        <p class="established">Est. 2020</p>
        <hr>

i put <header> instead of <main>

Thank Youu!! again

6

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