0

I am learning HTML and have written a couple of HTML scripts. I also know how to use CSS to style HTML webpages. I have an issue with linking a css file in my github page to a HTML script in my local computer. I am still practising HTML, but I can view how the HTML looks on a webpage through the HTML Preview extension in VS Code.

Here is my HTML code:

<html>
    <head>
        <title>A Big Title</title>
        <link rel="stylesheet" type="text/css" href="https://raw.githubusercontent.com/sammigachuhi/millennial_blogs/main/blog_styles.css">
    </head>
    <body>
        <h1>Header One</h1>
        <p>
Blah blah blah
        </p>
     </body>
</html>

The link to my html inside the href attribute is not working. I tried following advice from here where they mention changing it to read something like "https://sammigachuhi.github.io/millennial_blogs/main/blog_styles.css" to no avail. However, when I try with an publicly accessible css file such as href="http://www.w3schools.com/html/styles.css" the html changes to match the contents of that css file.

Could it be something with gitHub? Here is the link to my raw CSS file.

Samuel Gachuhi
  • 55
  • 6
  • Does this answer your question? [Stylesheet not loading from a URL (GitHub raw)](https://stackoverflow.com/questions/59205959/stylesheet-not-loading-from-a-url-github-raw) – Maximilian Ballard Nov 17 '22 at 07:45
  • Looking at the post and the gitcdn which is the platform being proposed to host the css file, the gitcdn plaform is not working (it shows an application error). Rawgit which is being proposed here -https://stackoverflow.com/questions/7780550/referencing-a-css-file-in-github-repo-as-stylesheet-in-a-html-file/55054746#55054746 for the same problem was shut down a long time ago. If there is no solution, I guess I will stick to using an internal css for now. Thanks – Samuel Gachuhi Nov 18 '22 at 11:18
  • 1
    Hello @MaximilianBallard I found it. One simply needs to host the css file at Github pages, not the usual github site. I did it as follows: Go to your gitHub repository which hosts the css file. Go to settings. Under the General menu, go to `Pages`. Under "Pages", which shows as `Github Pages, under 'Build and Deployment` select 'From branch', select the location, preferable under a `Docs` folder for ease. This link helped me: https://autogis-site.readthedocs.io/en/2021/lessons/L5/share-on-github.html – Samuel Gachuhi Dec 13 '22 at 09:19

1 Answers1

0

Hello @MaximilianBallard I found it. One simply needs to host the css file at Github pages, not the usual github site. I did it as follows: Go to your gitHub repository which hosts the css file. Go to settings. Under the General menu, go to Pages. Under "Pages", which shows as Github Pages, under 'Build and Deployment select 'From branch', select the location, preferable under a Docs folder for ease. This link helped me: https://autogis-site.readthedocs.io/en/2021/lessons/L5/share-on-github.html

Samuel Gachuhi
  • 55
  • 6