Learn Basic CSS by Building a Cafe Menu - Step 23

HTML-CSS
1

Tell us what’s happening:

i dont understand the question, ive tried putting only div and only #menu and both and i dont understand my mistake, thank you in advance!

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <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"/>
  </head>
  <body>
    <div id="menu">
      <main>
        <h1>CAMPER CAFE</h1>
        <p>Est. 2020</p>
        <section>
          <h2>Coffee</h2>
        </section>
      </main>
    </div>
  </body>
</html>

/* file: styles.css */
body {
  /*
  background-color: burlywood;
  */
}

h1, h2, p {
  text-align: center;
}


/* User Editable Region */

#menu {
  width: 300px;
}
 #menu, div {
  background-color: burlywood 
}

/* User Editable Region */

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36

Challenge Information:

Learn Basic CSS by Building a Cafe Menu - Step 23

2

Welcome to the community @janja !

Please remove the lower selector with the #menu, div completely and add the background-color: burlywood; to to the upper selector. See if that works for you.

Happy coding and Happy New Year!

1 Like
3

thank you so much!! happy new year :blush:

1 Like
4

Happy to be able to help you move on in your coding journey.

Keep up the good progress @janja !

May 2024 bring you all of the blessings you hope for and deserve.

5

Hey @janja,

What happens is that you give the div an id of “menu” in your HTML. That is good.

In your CSS you “grab” all the elements that have an id of “menu”. You don’t have to use a div selector because you can “grab” it with the id selector (#menu).

Remember in your CSS an id selector always starts with a #. So in this case #menu.

Hopefully you have a better insight in what the code does. Happy New Year and happy coding! :smiley:

Evert

6

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