Learn Basic CSS by Building a Cafe Menu - Step 51

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

Your code so far

/* file: index.Ext.html */
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;
}

.item p {
  display: inline-block;
}

.flavor class {
  flavor: dessert;
  text-align: left;
  width: 75%;
}

.price {
  text-align: right;
  width: 25%
}

/* file: styles.Ext.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;
}

.item p {
  display: inline-block;
}

.flavor class {
  flavor: dessert;
  text-align: left;
  width: 75%;
}

.price {
  text-align: right;
  width: 25%
}

Your mobile information:

T430W - Android 12 - Android SDK 31

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

Link to the challenge:

2

You appear to have created this post without editing the template. Please edit your post to Tell us what’s happening in your own words.
Learning to describe problems is hard, but it is an important part of learning how to code.
Also, the more you say, the more we can help!

1 Like
3

I don’t understand how to add a .dessert to my .flavor class

2 Likes
4

See how you have all three here. Just add the comma to the .flavor and then add the .dessert in the same way as you did with this previous code. I thought it would make a good example.

Happy coding

4 Likes
5

this is the solution, thanks for your help.

1 Like
6

You are very welcome @jonathanjacobo1738 !

Keep up the good progress and happy coding!

7

It’s working. Thanks man

8

Mod edit: removed solution

9

@YuqiSun

It is great that you solved the challenge, but instead of posting your full working solution, it is best to stay focused on answering the original poster’s question(s) and help guide them with hints and suggestions to solve their own issues with the challenge.

We are trying to cut back on the number of spoiler solutions found on the forum and instead focus on helping other campers with their questions and definitely not posting full working solutions.