Learn Basic CSS by Building a Cafe Menu - Step 31

Tell us what’s happening:
i have 5 article elements and 2 p elements inside yet it is not working

Your code so far

Caramel Macchiato


Pumpkin spice


Hazel nut




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

          <article> <p>Caramel Macchiato</p> <p>3.75</p></article>
          <article> <p>Pumpkin spice </p> <p>3.50</p> </article>
          <article> <p> Hazel nut </p> <p>4.00</p> </article>
          <article> <p> Mocha </p> <p> 4.50 </p> </article>

<!-- 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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/ Safari/537.36 Edg/111.0.1661.43

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

Link to the challenge:

After the first coffee and price. What I was doing by mistake was nesting them in with the first one. To make my process easier, I just copied and pasted the first one down 4 times to meet the requirements. Hope this helps you. Happy coding.

its still saying the same thing

I cannot see your first coffee and price, French Vanilla 3.00
There should be 5 coffees and prices listed.

okay ive done it thanks

You are welcome. Happy coding.

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