Learn Basic CSS by Building a Cafe Menu - Step 23

Tell us what’s happening:

I have coded according to the help in a previous forum. I also watched a YouTube and did exactly what they showed and double-checked my spelling, etc. Still doesn’t pass. I’m at a loss.

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 */


div {
  width: 300px;
  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/123.0.0.0 Safari/537.36 Edg/123.0.0.0

Challenge Information:

Learn Basic CSS by Building a Cafe Menu - Step 23

My code:
body {
/*
background-color: burlywood;
*/
}

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

div {
width: 300px;
background-color: burlywood;

Hi there! You’ve modified the template. Change back this div selector to #menu and your code will pass

No need to duplicate your code here, it’s in your main post

Thank you that did it.
Do you what the “div” element does? It seems that in this exercise the title of the webpage didn’t change.

div element is create a separate block for it’s children elements for css styling using it in the html.

In addition to Hassan’s comment, the <div> tag is used as a container for HTML elements to structure the page.
If you want to change the title of the page, change it in the title in the head element

1 Like