Learn Basic CSS by Building a Cafe Menu - Step 12

HTML-CSS
1

Tell us what’s happening:
The step is asking me to create new type selectors for h2 and p by adding new type selector for each one to the existing style element.
I have tried to code it like this:

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

yet it tells me to not change the existing h1 selector.
So I tried with to code it like the one currently shown yet this time it tells me that I should not add a new style tag and apply the new CSS rules to the existing style tag. I’m lost at this point I couldn’t figure it out.

Your code so far

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Cafe Menu</title>
    <style>
      h1 {
        text-align: center;
      }
      h2 {
        text-align: center;
      }
      p {
        text-align: center;
      }
    </style>
  </head>
  <body>
    <main>
      <h1>CAMPER CAFE</h1>
      <p>Est. 2020</p>
      <section>
        <h2>Coffee</h2>
      </section>
    </main>
  </body>
</html>

Your browser information:

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

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

Link to the challenge:

2

Your code is correct. Try resetting the challenge, and just paste the h1, h2, and p inside of the style tags they give you and see if that works. That’s what I did with your code, and it passes. May just need a reset

The code you initially tried would be correct as well, but it fails because the challenge is looking for the specific selectors to be separate. That would completely work outside of this challenge

3

I tried yet it did not work I think I did something wrong. Restarting didn’t solve the problem.

4

You reset the challenge and then pasted this in between the style tags?

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

image
image1122×819 40.6 KB

6

You can edit your post, and click on the gear icon on the right side of the edit box, and it will give you a blur option

but thats weird its not working. The code is correct

7

Maybe my browser extensions are causing the issue yet I highly doubt it.

8

Some browsers do cause issues with challenges. Which one are you using?

9

I’m currently on brave.

10

Hi!
Your code passes for me.

  1. Try turning off any web browser extensions.
  2. Try another web browser.
  3. Make sure your web browser is up to date.
11

To be honest, I have never heard of that one. I mean it could be what is causing the issue. I usually suggest people use chrome

12

Thanks for the fast response I fixed the issue by disabling Dark Reader extension.
I think because it changes the color of the site it also changes the style of it? I don’t really know but it is fixed now.

1 Like
13

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