Learn Basic CSS by Building a Cafe Menu - Step 32

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

  **Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
<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"/>
</head>
<body>
  <div class="menu">
    <header>
      <h1>CAMPER CAFE</h1>
      <p>Est. 2020</p>
    </header>
    <main>
      <section>
        <h2>Coffee</h2>
        <article>
          <p>French Vanilla</p>
          <p>3.00</p>
        <article>     
        </article>
         <article>
            <p>Carmel Macchiato</p>
            <p>3.75</p>
            <article>
             <p>Pumpkin Spice</p>
              <p>3.50</p>
            </article>
             <article>
              <p>Hazelnut</p>
              <p>4.00</p>
              </article>
                <p>Mocha</p>
                <p>4.50</p>
                </article>
      </section>
    </main>
  </div>
</body>
</html>
/* file: styles.css */
body {
background-image: url(https://cdn.freecodecamp.org/curriculum/css-cafe/beans.jpg);
}

h1, h2, p {
text-align: center;
}

.menu {
width: 80%;
background-color: burlywood;
margin-left: auto;
margin-right: auto;
}
  **Your browser information:**

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

Challenge: Learn Basic CSS by Building a Cafe Menu - Step 32

Link to the challenge:

Hey! whenever you face problems with any of the challenges, its better to add a descriptive title as the title so its easier for others to help you.

as for this particular problem, it looks like you have your start and end tags mixed up. As a refresher, any HTML element should be in the form of

//start       end
<article> </article>

you can have multiple element nested inside of a particular element.

//start    
<article> 

    <p>this is a paragraph </p>
    <button>hello<button>

//end
</article>

however, what you cannot do is start an element inside of a parent element and end it outside like this.

<article>
    <p>
</article>
   </p>

this is wrong and will cause expected behavior.

Hope this helps! :smile:

You have to open and close your article tags correctly.

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