Learn Basic CSS by Building a Cafe Menu - Step 14

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

this is my next step is to create the styles ive created in html in a styles.css code but unsure on how to start a css code, below is the step, i assumed to start like this

h1,h2,p
text-align:cnter;

— also like this

style

h1,h2,p

text-align:center;

style

but to no prevail

ou have styled three elements by writing CSS inside the style tags. This works, but since there will be many more styles, it’s best to put all the styles in a separate file and link to it.

We have created a separate styles.css file for you and switched the editor view to that file. You can change between files with the tabs at the top of the editor.

Start by rewriting the styles you have created into the styles.css file. Make sure to exclude the opening and closing style tags

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Cafe Menu</title>
    <style>
      h1, h2, p {
        text-align: center;
      }
    </style>
  </head>
  <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/106.0.0.0 Safari/537.36

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

Link to the challenge:

this is how to write a css code

h1, h2, p{
text-align: center;
}
i hope this helps you

ahh ok, so the element style is what they meant by style tags, i thought the ’ { }’ symbols, helped alot thankyou

1 Like