Learn Basic CSS by Building a Cafe Menu - Step 33

Describe your issue in detail here. Can’t figure where my syntax is lacking. Is it me or is this right?
.flavor {
text-align: left;
}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>
            <p class="flavor">French Vanilla</p>
            <p>Caramel Macchiato</p>
            <p>Pumpkin Spice</p>
/* 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;
 .flavor {
  text-align: left;

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.1 Safari/605.1.15

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

Link to the challenge:

The syntax is correct but it looks like you put it in the .menu class selector.

You need to end the .menu selector with its closing brace and then put this code outside it as a separate class selector.

1 Like

Wow!!! I’ve been here for hours trying to figure this out! Thankyou so much! You are a mental health :ring_buoy: lifesaver

lol thanx.:grin: Pls mark this as a solution then.

1 Like

This only my second question since starting the course. I didn’t know the solution button existed

yep and it gives helpful people brownie points to reward them for having your back :wink: keep up the good work!


Now that I know I will absolutely mark all solutions. Hopefully I won’t need many🫠

1 Like

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