Learn Basic CSS by Building a Cafe Menu - Step 15

please guys any help would be much appreciate I am lost in this maze of code.

You 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.

h1 {link rel="text-align: center" h1 type="selector" href="style.css/> styles.css; } h2 {link rel="text-align: center" h2 type="selector" href="style.css/> styles.css; } p {link rel="text-align: center" p type="selector" href="style.css/> styles.css; }
  **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>
  <header>
    <h1>CAMPER CAFE</h1>
    <p>Est. 2020</p>
  </header>
  <main>
    <section>
      <h2>Coffee</h2>
    </section>
  </main>
</body>
</html>
/* file: styles.css */
<style>
    h1 {link rel="text-align: center" h1 type="selector" href="style.css/> styles.css;
    }
  h2  {link rel="text-align: center" h2 type="selector" href="style.css/> styles.css;
    }
   p {link rel="text-align: center" p type="selector" href="style.css/> styles.css;
    }
  </style>

  **Your browser information:**

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

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

Link to the challenge:

@tosinakinrele you have taken the step very wrongly
now do reset the step
1. exclude the style tag i.e you should not add a style tag reason is style or any tag of HTML is invalid in style.css
2. Mistake over here is

use of link tag in style.css which is completely invalid
Now See the correct example :

selector{
       property: value;
}

let me explain well here selector is tag or classes like h1,h2, and p . in case the class selector starts with period(.) i.e

.class{
   property: value;
}

now let’s explain the property and value

  1. property can be the alignment, font, flex-box, grid, etc.
  2. value can be the number, position, percentage and pixels

according to our step/task, I will give an example you will more clear

 text-align(property): right(value);

Hope so this will help.

thanks for the reply but please sir am not still getting it would love if you showed me how the outcome looks like.

This part of the instructions says you need to delete the style tags.
But I see you still have them in your css file?

My suggestion is to:

  • click on restart step button
  • in your index.html, use your mouse to cut the style block out and paste it into styles.css
  • finally remove the style open and closing tags

Try the above steps…

2 Likes

yo thanks sir definitely taking the beginners course to expand my knowledge about solving question