Learn Basic CSS by Building a Cafe Menu - Step 36

Tell us what’s happening:
i tried to add the item class to it but it still cant run

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">
      <main>
        <h1>CAMPER CAFE</h1>
        <p>Est. 2020</p>
        <section>

<!-- User Editable Region -->

          <h2>Coffee</h2>
          <article>
            <p  class="flavor">French Vanilla</p>
            <p class="price">3.00</p>
            <p item></p>
          </article>

<!-- User Editable Region -->

          <article>
            <p>Caramel Macchiato</p>
            <p>3.75</p>
          </article>
          <article>
            <p>Pumpkin Spice</p>
            <p>3.50</p>
          </article>
          <article>
            <p>Hazelnut</p>
            <p>4.00</p>
          </article>
          <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;
}

.flavor {
  text-align: left;
}

.price {
  text-align: right;
}

Your browser information:

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

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

Link to the challenge:

The instruction: " start by adding a class attribute with the value item to the first article element under the Coffee heading."

Where did you find the instruction to add another ‘p’ element?
The ‘class’ attribute should be added to the opening <article> tag:

<element attribute="value"

This is guidance.

P.S. Take a look at the class=“flavor” and class=“price” in the same code snippet.

1 Like

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