Learn Basic CSS by Building a Cafe Menu - Step 16

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

in the console page it says You should have one self-closing link element but i’ve already put a ‘/’ at the end. I tried many ways but it still doesn’t work, could some one please hint to the problem? Thank you

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">

<!-- User Editable Region -->

  <head>
    <link rel="stylesheet" href="styles.css" /> 
    <meta charset="utf-8" />
    <title>Cafe Menu</title>
  </head>

<!-- User Editable Region -->

  <body>
    <main>
      <h1>CAMPER CAFE</h1>
      <p>Est. 2020</p>
      <section>
        <h2>Coffee</h2>
      </section>
    </main>
  </body>
</html>
/* file: styles.css */
h1, h2, p {
  text-align: center;
}

Your browser information:

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

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

Link to the challenge:

Your code passes when I run it. Have you tried resetting the step?

1 Like

Yes, I did. I’ve reset the step, but it still tells me there is an error :confused: I’ve logged out and logged in again, but I still couldn’t pass the step.

Its the placement of your link.

Files are read from top to bottom. In JavaScript the order is important.

It seems the order of your head element is also important.
move the link bellow the meta element

Hello, thank you for your suggestion and i’ve done what you’ve said and it still doesn’t work :confused:

  <head>
    <meta charset="utf-8" />
    <title>Cafe Menu</title>
    <link rel="stylesheet" href="styles.css" />
  </head>

Ok.
This is what I did, I copied the code you posted earlier then I reset the lesson finally I pasted the code there.

Your solution works from my end. Please try one of the following steps to move forward.

Click on the “Restart Step” button and force a refresh of your page with CTRL + F5 then try to paste the code in again.

or - Try the step in incognito or private mode.

or - Disable any/all extensions that interface with the freeCodeCamp website (such as Dark Mode, Ad Blockers, or Spellcheckers), and set your browser zoom level to 100%. Both of these factors can cause tests to fail erroneously.

or - Ensure your browser is up-to-date or try a different browser.

I hope one of these will work for you.

4 Likes

Thank you so much for the help! After I try incognito mode it works! :smiley:

1 Like

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