CodePen problems

I’m using vscode to write html and css for my personal portfolio webpage. But to submit it to freecodecamp it needs to be in codepen. On previous challenges i would just copy and paste code and it worked but now it doesn’t. Page looks just like I want it when i just open my local copy in chrome but my pen on codepen looks different, some elements have weird dimensions and it loads media queries when it shouldn’t. Am I doing it wrong or…?

You would need to share your pen in order for anyone to help.

Hello there.

Some things to note when using CodePen:

  1. CodePen does not expect any content outwith the body tags.
  2. All meta, link, and script information must be put in the :gear: 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 :gear: section.
  5. The editors offer the ability to format and analyse your code, providing useful information about forgotten closing tags etc.

If you are still confused with how to use CodePen, please read the official documentation.

Hope this helps

The error said that the front page div should be the height of the viewport. You can do this by doing:

element {
  height: 100vh; /* this means 100% of the viewport height scale*/