Learn Basic CSS by Building a Cafe Menu - Step 40

Tell us what’s happening:

I did change the flavor and price with no spaces in the p element. But still it’s not passing! Please help me for what to do next here? I used backspaces for this edit.

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">

<!-- User Editable Region -->

            <pclass="flavor">French Vanilla</p>
            <pclass="price">3.00</p>

<!-- User Editable Region -->

          </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;
}

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

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

Your browser information:

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

Challenge Information:

Learn Basic CSS by Building a Cafe Menu - Step 40

Hi,add space between the p tag and your classes

Hope it works

Hello @rajarshi.pakrashi01 !

It appears there is some misunderstanding of the instructions.

This step would like us to

place our cursor before the opening angle < bracket of the p element containing the price class.

Then, it asks us to

use the backspace on our keyboard

to

move the p element with the price class to right behind the p element with the class flavor.

It should appear like this example when completed.

Example only:

<p with class>Text</p><p with class>Text</p>

I hope this helps to better understand the instructions and that you are able to move on in your coding journey.

Keep up the good progress!

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