Learn Basic CSS by Building a Cafe Menu - Step 62

Hi all
This would be my first post and a adventurer seeking some new skills
however on my quest to completion i ran into a problem.
the problem is " You should use an h1 selector.:"
my code

h1 {
  font-size: 40px;
}
h2 {
  font-size: 30px;
}

from my understanding it makes sense to add h1 and h2 as seperate entries since both require different px values.

Ellis

Hi there and welcome to our community!

For future reference, it’s better to click the Help icon, which appears after you have submitted incorrect code three times.
This will create a forum post which automatically includes your full code, a direct link to the challenge and an opportunity for you to describe your issue in detail.

Your code looks correct, but there may be an issue elsewhere in your CSS, like a missing curly bracket from a previous selector or similar.

Hi, i would use that in the near future thank you for the advice!

ill add my code here so i dont have to open another thread

### Your code so far


```html
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Cafe Menu</title>
    <link href="styles.css" rel="stylesheet"/>
  </head>
  <body>
    <div class="menu">
      <main>
        <h1>CAMPER CAFE</h1>
        <p class="established">Est. 2020</p>
        <section>
          <h2>Coffee</h2>
          <article class="item">
            <p class="flavor">French Vanilla</p><p class="price">3.00</p>
          </article>
          <article class="item">
            <p class="flavor">Caramel Macchiato</p><p class="price">3.75</p>
          </article>
          <article class="item">
            <p class="flavor">Pumpkin Spice</p><p class="price">3.50</p>
          </article>
          <article class="item">
            <p class="flavor">Hazelnut</p><p class="price">4.00</p>
          </article>
          <article class="item">
            <p class="flavor">Mocha</p><p class="price">4.50</p>
          </article>
        </section>
        <section>
          <h2>Desserts</h2>
          <article class="item">
            <p class="dessert">Donut</p><p class="price">1.50</p>
          </article>
          <article class="item">
            <p class="dessert">Cherry Pie</p><p class="price">2.75</p>
          </article>
          <article class="item">
            <p class="dessert">Cheesecake</p><p class="price">3.00</p>
          </article>
          <article class="item">
            <p class="dessert">Cinnamon Roll</p><p class="price">2.50</p>
          </article>
        </section>
      </main>
    </div>
  </body>
</html>
/* file: styles.css */
body {
  background-image: url(https://cdn.freecodecamp.org/curriculum/css-cafe/beans.jpg);
  font-family: sans-serif;

/* User Editable Region */

h1 {
  font-size: 40px;
}
h2 {
  font-size: 30px;
}

/* User Editable Region */


.established {
  font-style: italic;
}

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

.menu {
  width: 80%;
  background-color: burlywood;
  margin-left: auto;
  margin-right: auto;
  padding: 20px;
  max-width: 500px;
}

h1, h2 {
  font-family: Impact, serif;
}

.item p {
  display: inline-block;
}

.flavor, .dessert {
  text-align: left;
  width: 75%;
}

.price {
  text-align: right;
  width: 25%
}

Yes, you’ve lost the closing curly bracket from the body selector above.

1 Like

Thank you so much! problem solved i might of back spaced far too many times haha
This is a great learning curve and double check previous entries