Learn Basic CSS by Building a Cafe Menu - Step 11

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

Your code so far

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Cafe Menu</title>

<!-- User Editable Region -->

    <style>
 h1 {
 text-align: center;
}
<style>
    h2 {text-align: center;} </style >
    <style>
      p {text-align: center;} </style>
    </style>

alternatively 

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

both fail, why?

<!-- User Editable Region -->

  </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 (Macintosh; Intel Mac OS X 10.15; rv:109.0) Gecko/20100101 Firefox/112.0

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

Link to the challenge:

Please Tell us what’s happening in your own words.

Learning to describe problems is hard, but it is an important part of learning how to code.

Also, the more you say, the more we can help!

the prompt is: Center the h2 and p elements by adding a new type selector for each one to the existing style element.

the first attempted response is:
h1 {
text-align: center;
}

h2 {text-align: center;} p {text-align: center;}
</style>

[that one fails, says not to amend existing h1 selector, which i haven’t]

second attempt response is:
h1 {
text-align: center;
}
h2 {text-align: center;}
p { text-align: center;}

[that one also fails, says not to amend existing h1 selector]

So, I would recommend resetting the lesson because you added a lot of style tags, and it may be difficult to sort it out. Resetting just makes it easier. After you do that you need to make sure you only have one set of style tags. Your code has several, but you only need to place the styles the challenge tells you to in between one set of tags. Every style goes in between those two

<style> </style>

Ok, thank you

step 1: reset the lesson
step 2: response

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

fails, Hint: You should not change the existing h1 selector

step 3: reset lesson

step 4: alternative response

h1 { text-align: center; }
<style> h2 {text-align: center;}</style>
<style>p {text-align: center;}  </style>

fails, Hint: You should not change the existing h1 selector

You are still adding multiple style tags. Like I said you should only have one pair of these tags for the entire challenge. All styles go between these two tags, each style does not get its own style tag

<style> </style>

thank you, i hear you, perhaps lets start here

if you refer to step 2 : response the answer is thus

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

there is only the opening and closing style tags in this response, it fails with a hint to not make any amendment to h1 (which i have not)

Can you show me exactly where your style tags are, because using step two passes the challenge for me. When you reply use format button which looks like </>. Please paste all your code between the two lines it gives you

    <style>
      h1 {
        text-align: center;
      }
      h2 {text-align: center;}
      p {text-align: center;}
    </style>type or paste code here

I plugged in the code you just posted, and it passes the challenge for me. There are a few steps you can take. Try resetting, and refreshing the challenge one for time then submit the code again.

If that doesnt work make sure you dont have an browser extensions running like ad blocker, or dark mode. These can cause challenges to fail from time to time.

Finally, if that doesnt work then try submitting the challenge in a different browser

thank you, think i’ll skip past rest and submit on a different browser after a time

your patience and guidance are greatly appreciated

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