Learn Basic CSS by Building a Cafe Menu - Step 24

Tell us what’s happening:

Describe your issue in detail here. so this is what i am trying to do " Step 24

Now it’s easy to see that the text is centered inside the #menu element. Currently, the width of the #menu element is specified in pixels (px).

Change the width property’s value to be 80%, to make it 80% the width of its parent element (body)." please help me to understand what i am not doing right

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: 80px;
  background-color: burlywood;
}



/* User Editable Region */

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36

Challenge Information:

Learn Basic CSS by Building a Cafe Menu - Step 24

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!

NEVERMIND I HAVE FIGURE IT OUT, THANK YOU

1 Like

Hi again @claudia11

The unit is % not px

Happy coding

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