Learn Basic CSS by Building a Cafe Menu - Step 32

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
I have no idea what they what me to I am must move the flavor and price to the left. I put both of them in the different P element and nested them in a article element. how do I move the two P elements (flavor and price) without affecting
all the


1. List item

so how do I shift
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>
            
            <p>French Vanilla</p>
            <p> 3.00</p>
           </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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36 Edg/107.0.1418.62

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

Link to the challenge:

2

if you read the step, it tells you to add the class name flavor to this line of code.
Just do it and you will pass.

3

Your problem is that you should have a class at the p>French Vanilla /p> element. Don’t foget about p’s elemets opening tag.

4

that is the problem I do not know what a class name is. Do i write class name and if so ,where??

5

You should have a class atributte at the “p” element which should be flavor.

6

this is an example from earlier in the project where you were asked to add the class name menu to this div

now you are being asked to add the class name flavor to the p element
so just do the exact same thing

7

I hear my guy but what is a class attribute . I know is a stupid question but i have no idea can u give me an example

8

https://www.freecodecamp.org/news/html-attributes-explained/

9

like this “p class= “flavor””/p"
"=<,>

10

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