# Learn Basic CSS by Building a Cafe Menu - Step 4

**URL:** <https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094>\
**Category:** Curriculum Help\
**Created:** [December 8, 2024, 10:14am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094 "2024-12-08T10:14:37Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![MARY7](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/mary7/32/371348_2.png) [@MARY7](https://forum.freecodecamp.org/u/MARY7)\
**Post date:** [December 8, 2024, 10:14am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/1 "2024-12-08T10:14:37Z")

</div>

### Tell us what’s happening:

i write correct code but my code is not running any one help me

### Your code so far

```html
<!DOCTYPE html>
<html lang="en">

<!-- User Editable Region -->

  <head><body>
    <meta charset="utf-8" />
    <title>Cafe Menu</title>
  </head></body>

<!-- User Editable Region -->

</html>

```

### Your browser information:

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

### Challenge Information:

Learn Basic CSS by Building a Cafe Menu - Step 4

> **[freeCodeCamp.org](https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-basic-css-by-building-a-cafe-menu/step-4)**
>
> Learn to Code — For Free

---

<div class="post-metadata">

**Author:** ![Ray13](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ray13/32/351582_2.png) [@Ray13](https://forum.freecodecamp.org/u/Ray13)\
**Post date:** [December 8, 2024, 10:34am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/2 "2024-12-08T10:34:29Z")

</div>

Hi there! Why opening `body` tag is inside your `head`?

---

<div class="post-metadata">

**Author:** ![MARY7](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/mary7/32/371348_2.png) [@MARY7](https://forum.freecodecamp.org/u/MARY7)\
**Post date:** [December 8, 2024, 10:36am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/3 "2024-12-08T10:36:16Z")

</div>

what do you mean its

---

<div class="post-metadata">

**Author:** ![Ray13](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ray13/32/351582_2.png) [@Ray13](https://forum.freecodecamp.org/u/Ray13)\
**Post date:** [December 8, 2024, 10:37am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/4 "2024-12-08T10:37:15Z")

</div>

In this step you have to

> add a `body` element below the `head` element.

Below the `head`

---

<div class="post-metadata">

**Author:** ![MARY7](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/mary7/32/371348_2.png) [@MARY7](https://forum.freecodecamp.org/u/MARY7)\
**Post date:** [December 8, 2024, 10:39am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/5 "2024-12-08T10:39:16Z")

</div>

now i write below the head but code doesnot run

---

<div class="post-metadata">

**Author:** ![Ray13](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ray13/32/351582_2.png) [@Ray13](https://forum.freecodecamp.org/u/Ray13)\
**Post date:** [December 8, 2024, 10:40am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/6 "2024-12-08T10:40:53Z")

</div>

Share your updated code, please

---

<div class="post-metadata">

**Author:** ![MARY7](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/mary7/32/371348_2.png) [@MARY7](https://forum.freecodecamp.org/u/MARY7)\
**Post date:** [December 8, 2024, 10:46am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/7 "2024-12-08T10:46:18Z")

</div>

![Screenshot 2024-12-08 154420](https://global.discourse-cdn.com/freecodecamp/original/4X/3/9/2/392f7e116fdd9151f659df9885b82b1fc3015d85.png)

---

<div class="post-metadata">

**Author:** ![Ray13](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ray13/32/351582_2.png) [@Ray13](https://forum.freecodecamp.org/u/Ray13)\
**Post date:** [December 8, 2024, 10:48am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/8 "2024-12-08T10:48:45Z")

</div>

Please don’t send screenshots of your code. To share your code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (`</>`) to add backticks around text.

 ![Pre-formatted-text](https://global.discourse-cdn.com/freecodecamp/original/3X/1/b/1b18854f1059217f29370444396145cc3a0cd8ae.gif)

See [this post](https://forum.freecodecamp.org/t/forum-code-formatting/25574) to find the backtick on your keyboard.  
**Note:** Backticks (`) are not single quotes (').

---

<div class="post-metadata">

**Author:** ![Ray13](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ray13/32/351582_2.png) [@Ray13](https://forum.freecodecamp.org/u/Ray13)\
**Post date:** [December 8, 2024, 10:49am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/9 "2024-12-08T10:49:55Z")

</div>

And your opening `body` tag should go below `head` too

---

<div class="post-metadata">

**Author:** ![Ray13](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ray13/32/351582_2.png) [@Ray13](https://forum.freecodecamp.org/u/Ray13)\
**Post date:** [December 8, 2024, 12:55pm UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/10 "2024-12-08T12:55:58Z")

</div>

Check this link to find the examples:

> **[W3Schools.com](https://www.w3schools.com/html/html_basic.asp)**
>
> W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

---

<div class="post-metadata">

**Author:** ![be\_happy](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/be_happy/32/339839_2.png) [@be\_happy](https://forum.freecodecamp.org/u/be_happy)\
**Post date:** [December 9, 2024, 6:53am UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/11 "2024-12-09T06:53:35Z")

</div>

Hey Buddy, Here Do you think you need to add the element `<body>` after your `<head>`

> [@MARY7](#):
>
> `<head><body>`

Or don’t you think it should be come after your _ **head element** _

```auto
<head>This is a heading element </head>

```

See here is the body element given below…

```auto
<body>
<h1>This is the head element</h1>
<p>This is the p tag</p>
</body>

```

Now you need to learn that your _ **body** _ element should come after _ **head element** _

Hope You Understand !!!

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [February 20, 2025, 8:00pm UTC](https://forum.freecodecamp.org/t/learn-basic-css-by-building-a-cafe-menu-step-4/724094/12 "2025-02-20T20:00:22Z")

</div>

Closed on February 20, 2025, 8:00pm UTC