Cannot link html/css pages - html

I have 3 pages:
index.html
pages/top-ten.html
pages/contact.html
My CSS code is in
css/css.css
Everything is fine with the index.html but when I copy the code to the other 2 pages the CSS isn't responding to that.
I'll attach snippets of the code index.html

Change
<link rel="stylesheet" href="./css/css.css">
to
<link rel="stylesheet" href="../css/css.css">
This will find the css file from those files which are one level deeper in the pages folder.

Related

Why does the Github Pages not use my CSS archive?

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!

CSS files in the same folder as HTML files work differently than if they were in separate folders. [Github Pages]

I am trying to host a website on GitHub Pages which seems to only work if I place the HTML, CSS and JS files in the root folder. But the problem with this is that the positioning of elements on a page of my website is messed up.
Folder structure where files are together with faulty result:
HTML: <link rel="stylesheet" href="home.css">
Folder structure where files are separated with correct result:
HTML: <link rel="stylesheet" href="/css/home.css">
Will anyone explain why this problem occurs?

HTML My css styles arent being outputted even though i have linked them

Image of my website page code
Image of the css code
As you can see the background and font change are not showing up even though I have linked them and refreshed the page numerous times after saving.
try these
<link rel="stylesheet" href="main.css" />
<link rel="stylesheet" href="./styles/main.css" />
use only main.css if the css file is in the same folder as your index.html
use ./styles/main.css if the css file is in another folder.
send a ss with your root folder with the files you are using in this project if it doesn't work

How to link CSS to HTML on Github

I have been trying to code a website, however, my CSS link is not working as my website only displays my HTML. I was wondering if I had linked it incorrectly or if there was a specific way I have to link for Github.
Thank you!
index.html
<link rel="stylesheet" type="text/css" href="assets/css/style copy.css/">
HTML Code

My CSS file in Github isn't being used by the HTML file

This is the link: https://footballcoder.github.io/YearOfCode/projects/about.html (source code: https://github.com/FootballCoder/YearOfCode)
If you see in my repo, I have a folder called projects and in there I have my about.html, and a folder called css. I have a file in the css subfolder that is called about.css, which is the css for about.html. I don't know why the css isn't being used. Is it the way the file is being linked or some other error. The link from the HTML file is in the tags.
change this
<link rel="stylesheet" type="text/css" href="/projects/css/about.css">
to this
<link rel="stylesheet" type="text/css" href="./css/about.css">
I hope this article can help you
You refer to the link as such:
<link rel="stylesheet" type="text/css" href="/projects/css/about.css" />
See if the following edit (removing '/projects/') fixes the problem.
<link rel="stylesheet" type="text/css" href="css/about.css" />
This should work because it is linking the path starting at the serving html, aka about.html, not at the root of your site. Just tested it with Dev Tools in Chrome, and it looks like it works (and is super cool!)
Side note: if your fonts from Google aren't loading, move the custom CSS below those links in the head. I'm not sure if they are or not since I'm not familiar with them, but that will work if that is also an issue.