GitHub pages loading random CSS file. Different to local build #22252
-
Hi there! I’m running a Jekyll site and everything is looking sweet locally but when the site is deployed to GH Pages some random CSS file is loaded instead of the one I have supplied. I have disabled any jekyll themes. Here is my repo: https://github.com/uccser/ci-dashboard I have this link to my style sheet in my HTML: and I have put this in my _config.yaml file:
When the site is published to GH pages the css file it loads is this: But locally it loads like this: None of the css I have supplied in my own file loads and I have no idea where the rules in the css file on GH Pages have come from. Local: GH Pages: |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments
-
It looks like you’re running into a similar pathing issue as listed in this answer here:
Thanks for posting those links! The reason this is happening is because of a relative path issue with how the browser loads this image file on GitHub.com compared to on your Pages site. Looking at the code for this image: <img src="/images/demo/meeting.jpg"> You’ve referenced your CSS import like this:
The URL you want the browser to be loading is the following:
However, it’s actually loading this URL—the CSS file for another site hosted under your account:
To fix this you’ll need to make sure that Jekyll adds your repository name to your link when building your site. You can do this by setting the
You’ll then need to update your CSS link to tell Jekyll to prepend this baseurl value to your links:
|
Beta Was this translation helpful? Give feedback.
-
@thomasshaped thank you SO MUCH!!! You’re amazing. |
Beta Was this translation helpful? Give feedback.
It looks like you’re running into a similar pathing issue as listed in this answer here: