CSS file not being processed in the website published

Hello! I am new at Github and have recently learned a bit of HTML and CSS. I added my files with HTML and CSS code on it but when I published my website, the CSS code wasn’t added. I would really like some help with it.
Thankyou

Hello @kamyashinde, welcome to the GitHub Support Community!

Is this the repository in question you’re having trouble with?

I’ve noticed multiple issues on it that are preventing your CSS file from working:

  • index.html:
    • change /styles.css --> styles.css (since the file is in the same directory as your html file, the slash is unnecessary – it’s actually referring to a higher directory)
    • Not CSS related, but I also noticed a broken image: change images/Kamya.png --> Kamya.png (there’s no images folder in your repo; the image you want to access is in the root, so all you need to do is reference the file)
  • hobbies.html and contact-me.html change CSS/styles.css --> styles.css (same issue as above, however, you’re referencing a folder – CSS – that doesn’t exist in your repo)
2 Likes

Hello! I am having the same issue. I added my files with HTML and CSS code on it but when I published my website, the CSS code wasn’t added. I have made some changes and it works but not correctly I would really like some help with it.
Thank you very much.

and the repository is https://github.com/Ericnk1/Pet-ClinicUI

Hello @Ericnk1,

I see a number of 404 errors on your website.

errors

The majority of them are the result of referencing directories that do not exist in your repo, such as node_modules. (was this a folder you forgot to add?) I would suggest double checking these resources to ensure that you’re pulling them from the correct folders, such as the ones currently present in your repo; css, dist, img, and js.

Thanks, I don’t know why when I push my project to github or make some commits node-modules folder is not integrated. can you please advice what to do.

Thank you very much.

Ah, I believe that’s because of your .gitignore file. You currently have it set to ignore node_modules.

https://github.com/Ericnk1/Pet-ClinicUI/blob/cc1e40604bcd74fb4ff365f0beb155188ec9d208/.gitignore

You can edit .gitignore to remove that line or just delete it altogether, since that’s the only entry in that file.

Hi, I did edit the gitignore but it didn’t solve the issue. I also realised the css is well applied on Edge but not on Chrome, however the Script, JQuery, and some other files can’t be reached even with node_modules added.

Hmm… I’m assuming it’s related to jekyll ignoring it during processing. Since it doesn’t look like you’re using jekyll, try adding an empty file named .nojekyll to the root of your repo. This will disable jekyll processing and should hopefully fix the issue.

It’s working fine now.
Thank you very much!

1 Like

Well I’m just learning CSS and html and I hope I know it fully.
Moreover is this correct about html?

I think this is what is wrong.

<!doctype html>
<html>
<head>
<link src="your url here" rel="stylesheet.css">
</head>
</html>

This will now generate the .css file from source.