Tell us what’s happening:
When I submit my code, I get the following error and hint:
Test
Sorry, your code does not pass. Don’t give up.
Hint
You should not add a new style
tag. Add the new CSS rules to the existing style
tag.
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 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.2 Safari/605.1.15
Challenge: Learn Basic CSS by Building a Cafe Menu - Step 12
Link to the challenge:
@SimonMuc welcome to the community! Try to recall how to create a style rule with multiple selectors.
The idea is you will only set the properties to be changed once and then it will apply to the elements targeted by your selectors in a single style rule.
Hi @arantebillywilson , thank you for your fast reply! I am aware of that concept and even tried it after my solution wasn’t excepted. In the Problem statement of Step 12 it says explicitly that we should use one for each:
Step 12
In the previous step, you used a type selector to style the h1
element. Center the h2
and p
elements by adding a new type selector for each one to the existing style
element.
When I do try:
h1, h2, p {
text-align: center;
}
I get the following error and hint:
Test
Sorry, your code does not pass. Keep trying.
Hint
You should add a new h2
selector.
I see, my bad.
Yeah. I did try to solve the challenge, and it did pass on my end.
Can you try to hard reload the page (Ctrl + Shift + R), and try to solve the challenge once again?
1 Like
Thanks again for your help. After your suggestion I tried in a complete new browser and there it worked!