You should add the flavor class to the <p></p> element

I have added the flavor class to the <p></p> element?!

  **Your code so far**
/* file: index.html */
<!DOCTYPE html>
  <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" type="text/css" />
  <div class="menu">
      <h1>CAMPER CAFE</h1>
      <p>Est. 2020</p>
          <p> <flavor flavor="FrenchVanilla"> French Vanilla </p>
          <p>Caramel Macchiato</p>
          <p>Pumpkin Spice</p>
/* file: styles.css */
body {
background-image: url(;

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/102.0.5005.63 Safari/537.36 Edg/102.0.1245.39

Challenge: Step 33

Link to the challenge:

so why isn’t this code working?

classes are assigned like this <elementname class="classname"> and you have to also define it in css file like this .classname {property: value}. sometimes insructions ask you to assign a class to element only in one lesson and to define it in css file in next lesson

you have to assign flavor class to p element

      <h1`><p`> <`div c`lass="`Flavor"> French Vanilla <`/p><`/h1>

and yet I still have to assign the flavor class to the p element,
the lesson suggests I don’t edit the css. file yet, I don’t know the name of the ‘text-`align’ yet, and here is the solution without all that.

French Vanilla - 3.00

you have to assign flavor class to p like this <p class="flavor">

that’s within the tag, not the element?

yes it should be within the opening tag

Ah so element’s can also be a selector too?

one is type selector which is like this for example for p <p> {text-align} it will target all paragraph elements to center its text. and other is class selector which is like this for example for flavor .flavor {text-align: center}, now this class when assigned to any element for example for p <p class="flavor" then text will be assigned for only those paragraph elements which are assigned flavor class. Hope you understand my point

Thanks, I will just go through this from scratch tomorrow and hopefully it will start to make more sense,
I think I have a different understanding of the phrase ‘selector’, I think I may be confusing it with the text in the " " - since <div> is just an element that creates a box/division and {`} seems to be the parameters of the selector(?maybe)

a selector is a css term for targeting a particular element if you are targeting element itself then its type selector and if you are targeting element(s) which are assigned a class then you will target the class not elements its called a class selector or id selector if the element has id instead of a class

ok, and the text (question) in <p class="(question)"`> is what is being selected by css? .question {parameters}

exactly, css will search class named .question then it will apply the properties of that class to the element which is assigned this class

1 Like

amazing, thanks, your a lifesaver!

Thank you so much, I was stuck on this.

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