Learn Basic CSS by Building a Cafe Menu - Step 22

  • please help me…*
<!-- 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>
      <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;/* comment here */
}

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

div {
  width: 300px;
}

Your browser information:

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

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

Link to the challenge:

what you have done here is added a comment with some text inside
This is not very useful wouldn’t you say?

Instead the exercise was asking you to comment out the background-color
The idea behind this is to make the browser unable to execute that line of code.
(once you surround some code with the comment characters, this code becomes unusable by the browser. This is useful for debugging for example or for testing out different styles).

So reset the code and this time, use the comment characters /* and */ to surround the background-color line to make unusable by the browser.

Thank you for this post. I was able to solve my problem with trying to get it right, too.
Using your post, it worked like a charm.

2 Likes

I solved it, by surrounding the property: value; with /* */ of the body element.

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