I am having a major issue trying to link to a stylesheet which is my root directory. I am connecting to it from a HTML file which is in a subdirectory of the root directory.
I would think this code would work (seeing as / means root directory)
<link type="text/css" rel="stylesheet" href="/style.css" />
However, it does not. Because the subdirectory is also only one folder down from the root directory, I also tried:
<link type="text/css" rel="stylesheet" href="../style.css" />
this also does not work.
Your first code line should work as "/" really means root :
<link type="text/css" rel="stylesheet" href="/style.css" />
This will find the file https://MY_DOMAIN/style.css
Are you sure that your file style.css is at the root of your project and not in another folder ?
Also you can try
<style>
#import url('/style.css');
</style>
I finally found a solution that works. For whatever reason, I could not link back to the root directory. I am still completely baffled about that, however, I did find a way to make it work.
I did it with this code:
<head>
<link type="text/css" rel="stylesheet" href="http://engagearcade.com/style.css" />
</head>
Related
The file structure in my GitHub repo is
--root
index.html
resume.css
--folder assets
resume.css
(yes I made two identical css file just in case one of them works but none of them works...)
I tried to reference css file as
<link rel="stylesheet" type="text/css" href="resume.css" media="all" />
or
<link rel="stylesheet" type="text/css" href="assets/resume.css" media="all" />
But again none of them works..
When I download the entire GitHub repo as a .zip file on my computer and unzippit, the website can display normally.
Is it something else I could do?
The webpage shows on my local file
and webpage on github
Can you check where you placed the <link> tag?
It should be inside the <head> tag
EDIT:
You can move highlighted section in here to parent <head> tag and remove <head> tag inside <div> tag
my css is not working correctly on my github page. This is my repo. This is my website. I created this portfolio website without Github pages and it works correctly. I am very new to github , so there is a good chance I'm missing something. I usually localize all my css/jscript but for simplicity reasons I changed all my css/javascript to the html link.
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css\main.css">
</head>
I had the same problem with my HTML file and my CSS file. I fixed it like this:
I had a repo with the index.html and a folder call "style" with the style.css file in it.
Deploy my index.html with the link tag within the head tag like this:
<link rel="stylesheet" href="./style/style.css" type="text/css">
Pay attention to the href attribute: "./style/style.css".
Andy.-
Like #TarasYaremkiv mentioned remove your './css/bootstrap-3.3.7/' folder.
The reason why it's happening is because Jekyll engine is looking for the includes present in the file 'bootstrap-3.3.7/docs/components.html'
For example: this file {% include components/glyphicons.html %} is not present in the components directory of your bootstrap folder. Hence the error.
You can avoid these kind of error's by downloading only the necessary compiled files or use cdn links
Change
<link rel="stylesheet" type="text/css" href="css\main.css">
to
<link rel="stylesheet" type="text/css" href="/css/main.css">
original post - External CSS not working with Github Pages
I'm building a basic site and thought of using the flatpages app for a couple of pages. Problem is, I'm not sure how to serve static files in my flatpages.
The link in my flatpage template is this:
<link type="text/css" rel="stylesheet" href="static/base.css" />
However, firebug shows that file is being looked at:
localhost:8000/example_flatpage/static/base.css
instead of
localhost:8000/static/base.css
Infact, every link in the template works this way.
Instead of
localhost:8000/home/
localhost:8000/example_flatpage/home/
Here's my default flatpage template:
<html><head>
<title>title</title>
<link type="image/x-icon" rel="icon" href="static/favicon.ico" />
<link type="text/css" rel="stylesheet" href="static/base.css" />
</head>
<body>
mainly plain text
</body>
</html>
Any ideas??
Use "/static/base.css" instead of "static/base.css". The first one is a path relative to root '/', while the second form is a path relative to the current page.
I'm having some issue with importing a .css file in my jsp within the eclipse using this tag
<link rel="stylesheet" href="css/style.css" type="text.css">
The structure of my pages is so
WEB-INF
>jsp
>css(folder)
>style.css
>home.jsp
So basically home.jsp and the css folder are parallels, a relative url like the one i'm using should be fine according to most tutorial.
Do you see some problem?
Thank you
<link rel="stylesheet" href="css/style.css" type="text/css" />
Change it to a slash.
In your structure the css folder is style and in your link it is css
<link rel="stylesheet" href="style/style.css" type="text/css">
I am having an issue with style sheets in a higher director. Here is the example;
I have index.php and style.css in the example.com home folder. Then, I have example.com/contact with index.php in there. The index.php in the contact folder, points to the stylesheet at example.com home folder.
The issue I am having is say I want a div to be displayed as a block and be a hyperlink. The style.css works fine at example.com/index.php, but if you click the link while in the /contact folder, it will try to access /contact/index.php instead of just /index.php.
Is there a way to fix this?
Thanks!
I assume you mean you are having problems with the CSS path in different directories of your site?
You can link to the stylesheet absolutely, or by using base href ~
<link rel="stylesheet" type="text/css" href="http://mysite.com/style.css" />
or
<link rel="stylesheet" type="text/css" href="/style.css" />
or
<base href="http://site.com/" />
<link rel="stylesheet" type="text/css" href="style.css" />
Rather than using ../ (which I believe goes up 1 directory) use just /, which will go to root directory (e.g example.com/):
<link rel="stylesheet" type="text/css" href="/style.css" />