Learn Basic CSS by Building a Cafe Menu - Step 21

Tell us what’s happening:
I could not nest

element into
Could you please tell me how to nest
into?

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>
    <header>
      <h1>CAMPER CAFE</h1>
      <p>Est. 2020</p>
    </header>
    <main>
      <section>
        <h2>Coffee</h2>
      </section>
    </main>
  </body>
  </html>
/* file: styles.css */
body {
  background-color: burlywood;
}

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

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:105.0) Gecko/20100101 Firefox/105.0

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

Link to the challenge:

“Add a div element inside the body element and then move all the other elements inside the new div.”

Another way to say this is “Wrap all of the elements inside the body element with a div element.” Does that help?

I tried this one but it did not work, what’s wrong?

CAMPER CAFE

Est. 2020

Coffee

We need to see your actual HTML. To display your code in here you need to wrap it in triple back ticks. On a line by itself type three back ticks. Then on the first line below the three back ticks paste in your code. Then below your code on a new line type three more back ticks. The back tick on my keyboard is in the upper left just above the Tab key and below the Esc key.

You can also use the </> button at the top of the editor window to add the triple back ticks. Just make sure the keyboard cursor is on a line of its own.

1 Like
```<body>
    <div>
      <header>
        <h1>CAMPER CAFE</h1>
        <p>Est. 2020</p>
      </header>
      <main>
        <section>
          <h2>Coffee</h2>
        </section>
      </main>
  </div>
  </body>
`I tried the above code, but it did not work, please help me. Thank you.````

It looks right to me. Not sure why it wouldn’t pass for you? Maybe reload the page and try again?

1 Like

Yes sir, I also did not know why I stuck here for so long and cannot solve the problem.

It worked correctly after the page reloading. Thank you very much.

Thank @bbsmooth. I appreciated your help and so far I’ve learnt how to give helper a point, so I use the "Thank @bbsmooth " structure to thank you.