Learn Basic CSS by Building a Cafe Menu - Step 32

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
Hello. I have not sure where I am going wrong. I have included the class name as required:

class="flavor">French Vanilla

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>

<!-- User Editable Region -->

            <p>class="flavor">French Vanilla</p>
            <p>3.00</p>

<!-- User Editable Region -->

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

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36

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

Link to the challenge:

2

Hi there.

Your attributes (class is an attribute) should always be placed within your element’s opening tag. I see that you have placed it outside of the opening tag. This might have just been a typo and you included one too many > That’s what it looks like. It happens! A trick I learned is try reading backwards, meaning reading the last word or code and move backwards and up. It keeps your brain from inserting or deleting things automatically.

Next, the instructions ask you to place your p element with the 3.00 to the right of your other p element, not below.

3

Thanks, you pointed out my error.

4

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