Need help understanding this: styles.css file

HTML-CSS
1

Hi, I not sure what I have to do in this exercise. what is " styles.css file"
exercise says: Your styles.css file should have the h1, h2, p type selector.

I make this:

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

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

Your code so far

\ file: <!DOCTYPE html>
<html>
<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>
<!DOCTYPE html>
<html>
<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: <style>
h1 {
text-align: center;
}
h2 {
text-align: center;
}

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

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

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


  **Your browser information:**

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

Challenge: Step 15

Link to the challenge:

1 Like
2

Till before challenge you have written the code in HTML file itself. This is not a good practice. You need to maintain separate file for CSS. The challenge says they have created a file for CSS called Styles.css. All you have to do is Copy/Paste the code inside the style tag to the Styles.css file. Remember no need of adding style tags in CSS file. Let me know if you are able to solve the challenge now.

2 Likes
3

No, it gives me: Your styles.css file should have the h1, h2, p type selector.

1 Like
4

Yes you need to write the code which you have written in <style></style> in style.css file. You can reset the challenge to observe the style.css file mentioned top left beside the HTML file.

6

Like this?

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

p {
text-align: center;
}
7

As h1{// h1 styles} p{//p styles} and so on. have the same property that is text-align: center; So, you can rewrite the style.css file as h1, p, h2{//common property}.

1 Like
8

if all the tags have the same styling properties then all of them can be nested together.

1 Like
9

No, dont work for me. I try different ways.

h1 {
    text-align: center;
}
<h1 style = "text-align: center"</h1>
10

Do not include HTML elements inside the CSS file.

11

ok but why this dont work. I have been looking other videos and they use the same format but put <style>above. so i really dont get it. thanks

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

p {
text-align: center;
}
12

Hi @osx77 , to solve this exercise issue you should look up, on the top left side of your page and you should find “index.html” (in black) and “syles.css” (in white). Click on the second one (that is your css file) and that is where you should have your code that is requested from the exercise.

13

Your code should be something like this
h1, h2, p {text-align: center; style.css}

1 Like
14

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