Learn Basic CSS by Building a Cafe Menu - Step 14

HTML-CSS
1

Tell us what’s happening:
I don’t understand how to handle the code to input in this step. Please kindly put me through what to do here. Thanks
Describe your issue in detail here.

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 */

/* User Editable Region */

h1_style.css
h2_style.css
p_style.css

/* User Editable Region */

Your browser information:

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

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

Link to the challenge:

2

In the css you dont need to pull the elements as the .css.

you call them.

h1 {

}

h2{

}

p{

}

3

If you have to add a selector in the CSS file, follow the rules:

  1. if you want to target an HTML element your CSS rule will be:
element {
  property: value;
}
  1. if you want to target an HTML element with a specific class attribute, your CSS rule will be:
.class {
  property: value;
}
  1. If you want to target an HTML element with a specific id attribute, your CSS rule will look like this:
#id {
  property: value;
}

In this challenge, you have to create multiple elements selector in the CSS file:

element1, element2, element3 {
  property: value;
}
4

It has been resolved. thanks

1 Like