Learn Basic CSS Cafe Menu Review

After working the Survey Form i knew i needed to repeat lessons. But the code editor isnt responding with corresponding changes in code making it hard to see the changes and play with it.
should i just “reset” the entire lesson? i would not like to have to go back over the 4o steps ive completed again. what to do?

Your code so far

<!-- 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>Est. 2020</p>
        <section>
          <h2>Coffee</h2>
          <article class="item">
            <p class="flavor">French Vanilla</p><p class="price">3.00</p>
          </article>
          <article>
            <p>Caramel Macchiato</p>
            <p>3.75</p>
          </article>
          <article>
            <p>Pumpkin Spice</p>
            <p>3.50</p>
          </article>
          <article>
            <p>Hazelnut</p>
            <p>4.00</p>
          </article>
          <article>
            <p>Mocha</p>
            <p>4.50</p>
          </article>
        </section>
      </main>
    </div>
  </body>
</html>
/* file: styles.css */
body {
  background-image: url(https://cdn.freecodecamp.org/curriculum/css-cafe/beans.jpg);
}

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

.menu {
  width: 80%;
  background-color: burlywood;
  margin-left: auto;
  margin-right: auto;
}

.item p {
  display: inline-block;
}


/* User Editable Region */

.flavor {
  text-align: left;
  width: 50%;
}

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

/* 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/114.0.0.0 Safari/537.36

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

Link to the challenge:

The question has nothing to do with the ‘Caffe Menu’, but the code and the link belong to one of the challenges in that course. You are talking about the ‘Survey Form’ here. What is actually the issue here?

If you want to play around with code, use codepen.io platform and change there whatever you want in the code.

I repeat the task by creating it again in my own code editor. Change some styles to it.

Here:

1 Like

thank you…post must be 20 characters so they make you do this…

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