Any idea why a simple HTML and CSS page I did works in Chrome and Safari, but not in CodePen?

1

I was following an HTML and CSS tutorial to learn how to use VS Code and the Live Server extension. The site works fine on Chrome and Safari, but I just get a blank page when I upload the HTML and CSS files to CodePen. Are there any HTML tags or CSS rules that are known to cause issues in CodePen? Thanks for any help and have a great day!

2

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 :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 analyze 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

1 Like
3

Thanks a lot!

I had to remove the link statements that connected the CSS files to the HTML file. I thought it was just copy and paste from VS Code to CodePen.