Learn Basic CSS by Building a Cafe Menu - Step 14

HTML-CSS
1

Tell us what’s happening:
I don’t know what to do here. It says I have to create just one single type selector for all 3 elements.

  **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>
  <header>
    <h1>CAMPER CAFE</h1>
    <p>Est. 2020</p>
  </header>
  <main>
    <section>
      <h2>Coffee</h2>
    </section>
  </main>
</body>
</html>

  **Your browser information:**

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

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

Link to the challenge:

2

Let me break down an example similar to the one given in the challenge for you.

button {
      background-color: orange;
};
input {
      background-color: orange;
};

We can see that we want to apply the same style, an orange background, to both buttons and input elements.
So to save ourselves some time, especially if you needed to write the same style for many more elements, we can select multiple elements, and write the style for them all once.

button, input {
      background-color: orange;
}

This time, I didn’t need to write out background-color: orange twice, I was able to select both button and input elements and apply the same style to both.

Give this a thorough read, you can do it!

1 Like
3

THANK YOU VERY MUCH , IT WORKED!!! :smiling_face:

1 Like
4

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