Learn Basic CSS by Building a Cafe Menu - Step 52

HTML-CSS
1

Hello! The website keeps hitting me with " Your .dessert elements should have the text Donut, Cherry Pie, Cheesecake, and Cinnamon Roll." even though I’ve tried re writing it and even copying the code from a tutorial to a T and I’m still hit with the same message. Safe to say I’m stumped lol, does anything look out of place to y’all? Thank you in advance for the help!

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 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>

<!-- User Editable Region -->

          <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">Chessecake</p><p class="price">3.00</p>
          </article>

          <article class="item">
            <p class="dessert">Cinnamon Roll</p><p class="price">2.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, .dessert {
  text-align: left;
  width: 75%;
}

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

Your browser information:

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

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

Link to the challenge:

2

You’ve got too many s’s and not enough e’s.

3

You know what I didn’t even consider that lol. Thank you for your help ! Can’t believe it was so simple 0_0

4

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