Looks good in Codepen, but not in VS Code?

1

Hi y’all,

I’m working on the Landing Page Project. After struggling with it for a while, I decided to fork the Codepen example and copy and paste it into VS Code. I added the html, head, and body, and I linked the style sheet. But, when I tried to open it with Live Server, the formatting was completely different from the Codepen example. I’ve attached two pictures (edit: sorry, new users can only post one picture, and I can’t share a link to the codepen Landing Page either). Does anyone know why they might be so different?

Here’s what it looks like when opened with Live Server in VS Code.

VS%20Code%20version
VS%20Code%20version1569×903 249 KB

2

@busyhero, just a note. The stylesheet in the example is SCSS, did you keep is as such? Or change it to CSS?

2 Likes
3

I changed it to CSS! Is that wrong? Actually, I don’t know what SCSS is, I assumed it was the same thing. :0 I’ll look into that! I

4

Yes, there are some differences as you’ll find out when you start looking into it.

1 Like
5

I am having the same problem. I have a pen in codepen but when I copy/paste to VS Code, I am not getting the same web images. On codepen it was in SCSS and I downloaded the SCSS formatter element in VS Code but I’m not sure if I need to be doing something else.