# VS Code question

**URL:** <https://forum.freecodecamp.org/t/vs-code-question/570422>\
**Category:** General\
**Created:** [November 10, 2022, 8:33pm UTC](https://forum.freecodecamp.org/t/vs-code-question/570422 "2022-11-10T20:33:07Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![bananahair](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/bananahair/32/103092_2.png) [@bananahair](https://forum.freecodecamp.org/u/bananahair)\
**Post date:** [November 10, 2022, 8:33pm UTC](https://forum.freecodecamp.org/t/vs-code-question/570422/1 "2022-11-10T20:33:07Z")

</div>

I´m designing something that requires text vertically aligned with an image and both elements centered.

When I design it in VS Code, the text sits below the image on the left side of the screen. However, when I copy and paste this code to CodePen, everything is centered and the text and image are vertically aligned.

I don´t know why there´s such a difference. I´m posting my code as it is in CodePen below. If anyone can help me understand why the design would look so different in these different formats, I´d appreciate it.

[https://codepen.io/bananahair/pen/ExRWLZR](https://codepen.io/bananahair/pen/ExRWLZR)

---

<div class="post-metadata">

**Author:** ![hbar1st](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/hbar1st/32/372649_2.png) [@hbar1st](https://forum.freecodecamp.org/u/hbar1st)\
**Post date:** [November 10, 2022, 8:50pm UTC](https://forum.freecodecamp.org/t/vs-code-question/570422/2 "2022-11-10T20:50:33Z")

</div>

Hello there.

Some things to note when using CodePen:

1. CodePen does not expect any content outside the `body` tags.
2. All `meta`, `link`, and `script` information must be put in the ⚙ settings section of the HTML editor.
3. You do not need to/cannot link the _CSS_ in your HTML, if you place the CSS in the appropriate section.
4. If your project uses React, use the Babel preprocessor, and link the CDN in the appropriate ⚙ section.

If you are still confused with how to use CodePen, please read the official [documentation](https://blog.codepen.io/documentation/).

Hope this helps

---

<div class="post-metadata">

**Author:** ![system](https://global.discourse-cdn.com/freecodecamp/original/3X/e/1/e1c433102e34b46dfaa3e15d13ab9a514b127078.svg) [@system](https://forum.freecodecamp.org/u/system)\
**Post date:** [May 12, 2023, 8:50am UTC](https://forum.freecodecamp.org/t/vs-code-question/570422/3 "2023-05-12T08:50:40Z")

</div>

Closed on May 12, 2023, 8:50am UTC

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