Why does the Github Pages not use my CSS archive? - html

I'm trying to host my page on Github Pages but it is not recognizing my CSS file. I've tried changing the names, rearranging the folders and it still doesn't work. Does anyone know what can I do?
Here is my GitHub project.
I tried change the folder names, and putting the CSS file in the main folder.

Your index.html file is on the same level as your css folder. You'll need to remove ./ from ./css/style.css and you should be fine.

EDIT: I just checked it out and it looks like the CSS is loading.
Your github page
If you change your CSS link from
<link rel="stylesheet" href="./css/style.css">
to
<link rel="stylesheet" href="css/style.css">
I think your css wil work, happy coding!

Related

Github not loading css file when deployed by github pages

I was working on a preview card component and when I uploaded my code to a repo to deploy it, github doesn't seem to load my css file style.
note: not my first time to deploy on github pages.
thanks in advance!
repo link: https://github.com/HanyAyad/Stats-preview-card-component-
live-website link on github pages: https://hanyayad.github.io/Stats-preview-card-component-/
same website deployed on netlify (working fine): https://62116b02da6915993f04d79c--suspicious-hypatia-156ece.netlify.app/
Maybe because the folder is CSS/styles.css and your declaration in index.html is css/styles.css?
I just tested here and when importing your CSS file, you are using
<link rel="stylesheet" href="css/style.css">
when you should be using
<link rel="stylesheet" href="CSS/style.css" >
URLs may be case-sensitive, it depends on what file system you are running your website.
Try renaming the folder CSS to css.
The directory in your repo is named CSS and not css as expected. So, please rename the directory.
It only works on Netlify because it doesn't take casing into account, for some reason. (That is, https://62116b02da6915993f04d79c--suspicious-hypatia-156ece.netlify.app/CsS/sTyLe.css works fine.)

github pages doesn't display css for index.html but display for others

I read different questions on stackoverflow regarding this issue but i haven't got any solution for my case, the rest of my pages are displaying css well, but index.html doesn't display.
But surprisingly when i run my project locally it works very well.
What am i missing?
My github pages link :
https://huxaiphaer.github.io/-Ride-My-Way/index.html
My github project link , in the branch gh-pages:
https://github.com/huxaiphaer/-Ride-My-Way/tree/gh-pages
Your href was wrong for your css import. You were navigating up more folder.
<link rel="stylesheet" type="text/css" media="screen" href="UI/css/index.css">

Beginner: CSS and HTML working in Atom but not in GitHub

Total beginner here looking for plain English answers :)
I managed to successfully link my HTML and CSS sheets when using Atom and viewing the files in my browser, but now I'm trying to get this into my GitHub pages website and I can't make it work at all!
Here's the HTML: https://github.com/isbonnici/isabellabonnici.github.io/blob/master/index.html
Here's the CSS: https://github.com/isbonnici/isabellabonnici.github.io/blob/master/CAstylesheet.css
What am I doing wrong? Really would appreciate the help here.
There is no css folder in your github account. Remove css/ from the css path. It should start working. Change
<link rel="stylesheet" type="text/css" href="./css/CAstylesheet.css">
to
<link rel="stylesheet" type="text/css" href="./CAstylesheet.css">

CSS changes shows up in eclipse but not on browser

I have an index.html file and index.css. The directory structure is:
img of directory structure
I am linking the css to html with : link rel="stylesheet" type="text.css" href="css/index.css"
I am using tomcat v8.5 to host. When I run my project on server I see this in the window within eclipse:
browser displayed within eclipse
However when I open up chrome/firefox and search, it is only pulling the index.html and the css is not being displayed :(
I read that files have to be specified with "relative path", however, the folder containing index.css is in the same directory(WebContent) as the index.html. So what is the issue with href="css/index.css" ? Can someone please help me with the path issue?
Thanks so much for your time !
There is a slight mistake in the link tag. Replace type="text.css" with type="text/css":
<link rel="stylesheet" type="text/css" href="css/index.css">

All of my links broke when I uploaded my page to a hosting service

I just built my first website from scratch. All of my CSS and images are linked just fine from my computer, but when I uploaded everything to my hosting site (using Fat Cow) all of the links broke. So now I have an unstyled page with no images.
My .html is in the root directory and there are folders for my CSS, Fonts, Images, and JS. My style sheets are currently linked like this:
<link rel="stylesheet" href="css/style.css" />
This is what I've tried so far:
Moving style.css out of the CSS folder into the root and linking it
as "style.css"
Creating a new style.css directly in the root
linking it as "style.css"
Linking style.css (one in the root) as
"root/style.css"
Linking style.css (one in the root) as "fulldomainname/style.css"
This is my daughter's birthday present. Any help would be greatly appreciated!
Sarah
<link rel="stylesheet" type="text/css" href="http://www.yoursitedomain.com/css/styles.css">
try the above code and upload via ftp
Check FTP and make sure files are Uploaded properly, I advice you to download one and check it's not corrupt while uploading.
Check file path with "http://..."
check with relative path as well.
if you can't find solution please share link of your site so i can check it out.
It could also be a server permissions issue, meaning that you have to set up permissions for all the files in project.
link
Try to give full link of your website like
<link type="text/css" rel="stylesheet" href="http://www.yourwebsite.com/css/styles.css"/>
Put it into head section of your html page code.