Learn Basic CSS by Building a Cafe Menu - Step 27

Tell us what’s happening:
All variations of <div class="menu"> aren’t accepted by the site.

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>

<!-- User Editable Region -->

    <div class='menu'>

<!-- User Editable Region -->

      <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;
}

.menu {
  width: 80%;
  background-color: burlywood;
  margin-left: auto;
  margin-right: auto;
}

Your browser information:

User Agent is: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/115.0

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

Link to the challenge:

Hi @4ellendger ,
The issue that you are facing is because the quotes marks that you are using are wrong unfortunately =(

Instead of use ( " " ) in your <div class="menu"> you wrote ( ’ ') <div class='menu'>
This is why you are getting an error code.

I hope that will help you. :slightly_smiling_face:

1 Like

While this is a good suggestion

Its actually not the reason the challenge fails. Both single and double quotes can be used here

When I copy and paste your code the challenge passes for me. So make sure you dont have any browser extensions running when you submit the challenge.

You can also try submitting the challenge in a different browser.

1 Like

@Leams - issue was not in the quotes - I’ve tried double quotes as well. Sorry that pasted into the question my last attempt, not “the expected”.

Issue was in some browser state/cookies. Because after I’ve opened https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-basic-css-by-building-a-cafe-menu/step-27 in the private window of the same Firefox (by @Cody_Biggs advice) it confirmed my code from the 1st attempt.

Thank you Cody for the advice!

1 Like

Ok, issue was in GitHub - miraks/Tap-Translate: Adds a translate button to long-tap menu extension. Because met the same issue in https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-the-css-box-model-by-building-a-rothko-painting/step-6 After disabling this “Tap Translate” extension freecodecamp confirmed my changes.

Hi @4ellendger,
Thank you for your comment.

Happy to read that you could continue with the rest of the exercise and finish it.

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