Learn Basic CSS by Building a Cafe Menu - Step 31

Tell us what’s happening:
I am pretty sure I have everything correct I have individual article elements for each coffee flavor and 2 “p” elements per article

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
    <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"/>
    <div class="menu">
        <h1>CAMPER CAFE</h1>
        <p>Est. 2020</p>

<!-- User Editable Region -->

            <p>French Vanilla</p>
            <p>Caramel Machiato</p>
            <p>Pumpkin Spice</p>

<!-- User Editable Region -->

/* 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 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/ Safari/537.36 OPR/

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

Link to the challenge:

Welcome to our community!

Add to each first p element in all ‘article’ elements a class attribute set to the value of “flavor”, and to each second p element a class set to the value of the “price”.

i just added them to the code and now it still isn’t working not sure what I’m doing wrong

first of all you have several typos in the code,
like in second article.
also last closing tag of your p element is coded wrongly.

If you have made any corrections in the HTML structure, and it doesn’t pass the challenge, post it here again.

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