Learn Basic CSS by Building a Cafe Menu - Step 21

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

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

/* User Editable Region */

<div>
body {
  background-color: burlywood;
}

h1, h2, p {
  text-align: center;
  #menu{
    width: 300px;
  }   
}
</div>

/* 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/116.0.0.0 Safari/537.36

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

Link to the challenge:

2

Hey, welcome to our forum.
You have several issues that need to be resolved.

You have a div element in your CSS code, in CSS we use selectors if you want to style any element, you select it using an element selector, you cannot use elements directly.

Your h1,h2,p selector is not closed.

Also, you have an extra curly brace before your closing div.

1 Like
3

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