Learn Basic CSS by Building a Cafe Menu - Step 44

Tell us what’s happening:

It’s telling me to create 5 .flavor elements but there is only room for 4. Maybe I’m missing something. Would someone be able to help me with this?

Thank you in advance,
Jonathan

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>
          <h2>Coffee</h2>
          <article class="item">
            <p .flavor class="flavor">French Vanilla</p><p class="price">3.00</p>
          </article>

<!-- User Editable Region -->

          <article class="item">
            <p .flavor Caramel Macchiato</p><p>price 3.75</p>
          </article>
          <article class="item">
            <p .flavor Pumpkin Spice</p><p> price 3.50</p>
          </article>
          <article class="item">
            <p .flavor Hazelnut</p><p>price 4.00</p>
          </article>
          <article class="item">
            <p .flavor Mocha</p><p>price 4.50</p>
          </article>

<!-- User Editable Region -->

        </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;
}

.item p {
  display: inline-block;
}

.flavor {
  text-align: left;
  width: 50%;
}

.price {
  text-align: right;
  width: 50%;
}

Your browser information:

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

Challenge Information:

Learn Basic CSS by Building a Cafe Menu - Step 44

Add class attribute with the value flavor to each p element that have flavor name within it. Also remove space between text and p tags.
@jpccdirect

Example

<p class="requirevalue">some text</p>