I was linking my external css file to the header of my page, like this
<head>
<link href="/css/style.css" rel="stylesheet" type="text/css" />
</head>
But the styling wasn't working until I added a dot to the path, like this
<head>
<link href="./css/style.css" rel="stylesheet" type="text/css" />
</head>
I have tried it in Firefox, Chrome, Mozilla and Opera and everywhere was the same result.
How can this be possible? Since in all the sites I have searched, they indicate that to go up to the root folder you just need to type "/css/style.css" without a dot.
Thank you in advance for your time.
It always depends in which folder you css file is. if you have a structure like this:
-index.html
-css (folder)
--style.css
than you can write css/style.css, but if it is like this
-pages (folder)
--index.html
-css (folder)
--style.css
than you have to add a ./css/style.css because "./" means to get a folder back bevore entering the css folder
The . mean's
one folder back/[path]
normaly u write ../[path]
EDIT:
i dont know how your Folder architektur look's like, and if you using JQuery or Javascript for loadin's that's important informations..
Related
Please could you help me with this styles.css and bootstrap.cssto the 531.html.
css folder
- styles.css file
- bootstrap css folder
- bootstrap.min.css file
gallery folder
name folder
animals folder
- 531.html file
Asyou can see i need a link solution to link the bootstrap and styles css files to the 531.html file.
To link those two CSS files:
<link rel="stylesheet" href="../../../css/style.css" />
<link rel="stylesheet" href="../../../css/bootstrap/bootstrap.min.css" />
To go up multiple directories and then go to a subdirectory, you can do this.
<link rel="stylesheet" type="text/css"
href = "../../../css_folder/styles.css">
<link rel="stylesheet" type="text/css"
href = "../../../css_folder/bootstrap_folder/bootstrap.min.css">
Note that a single "../" goes up one directory. You can chain them and go up, then go down as usual with a "/folder".
To go to document root and traverse from there, you can use "/"
eg:
<.. href="/resource.css ..>
<.. href="/folder_1/resource.css ..>
This works for any file reference.
I can't linked to my CSS file in my HTML file in localhost.
I have my index.html and styles.css in /var/www/html/project
I call it in the browser with localhost/project/index.html and only the html is printing.
When I just open the html in the browser, it's working fine.
I tried
<link rel="stylesheet" href="http://var/www/html/project/styles.css" media="all">
I also tried in the href
localhost/project/styles.css
or project/styles.css
or /project/styles.css
But nothing, what am I doing wrong ?
Thx
The path you put for your CSS file should be RELATIVE TO the location of your html file.
If your HTML file has the path /var/www/html/project/index.html, then it's location is the project folder. That folder becomes the "root" of your project, and the CSS path should be relative to it:
styles.css
Did you try:
<link rel="stylesheet" type="text/css" href="styles.css"/>
If your css file and your html file is in the same folder, you just need to reference it by name and the file extension, I think.
If the CSS file is in the project file (with the index.html file) your link should look like this:
<link rel="stylesheet" type="text/css" href="styles.css">
As an example for VS13 link the css as shown below:
<link href="~/MyFolder/Style.css" rel="stylesheet" />
I also found a solution. You don't need anything. Do
<style type="text/css" media="all">
/* Your code */
</style>
and
<script type="text/javascript" charset="UTF-8">
// Your code
</script>
Don't link them. Do it Internal. Thanks me later
So I added type = text/css and thx the CSS is working, but if I move my CSS in a CSS folder css/styles.css is not working
with my html file in /var/www/html/project/index.html
and my css file in /var/www/html/project/css/styles.css
But in any case images are not charging :
and I have my images in /var/www/html/project/img/banner.jpg
I've using bootstrap and file and folders is like this
root/css/..
When I include <link id="bs-css" href="css/bootstrap.min.css" rel="stylesheet"> it is working for files in root folder. But if I have file in another folder and trying to include css doesn't work. It doesn't show any style. For example
root/users/profile.php
then I include in profile.php like this
<link id="bs-css" href="../css/bootstrap.min.css" rel="stylesheet">
I've also tryed full path again didn't work properly. But if I put inside /users/ css file or full folder is working href="css/bootstrap.min.css"
You can change the link to be the full path from your URL like this:
<link id="bs-css" href="yoursite.com/css/bootstrap.min.css" rel="stylesheet">
That should work from any page.
Try using href="/css/bootstrap.min.css" This should work no matter where your php or html file is located. This is called a relative path. So..
<link id="bs-css" href="/css/bootstrap.min.css" rel="stylesheet">
As long as css is a direct child of the root, this should find it.
For the index file
<link rel="stylesheet" href="css/stylesheet.css"/>
That works fine no problem here though.
The rest of my html documents are in a folder called "pages". Here though it cant find my CSS sheet. I tried
<link rel="stylesheet" href="../oliverteglhus.dk/css/stylesheet.css"/>
Does not work. Sorry for this noob question. It's just bugging me.
it should be:
<link rel="stylesheet" href="../css/stylesheet.css"/>
If the rest of your documents are in a folder that is in the same directory as your index file, then you only need to go up one directory to find your CSS file:
<link rel="stylesheet" href="../css/stylesheet.css"/>
So, if your directory structure looks like this:
-index.html
-pages
page1.html
page2.html
etc...
-css
stylesheet.css
To load the stylesheet.css from CSS folder in page1.html, you have to use like
<link rel="stylesheet" href="../css/stylesheet.css"/>
Check this answer for a more detailed explanation
I am working on my website, and my HTML isn't linking to my CSS. Can somebody please shed some light on this issue?
This is the snippet from my code.
<link href="css/style2.css" rel="stylesheet" type="text/css">
My file directory goes like this.
/root
/css
style.css
style2.css
/html
index.html
webconfig.html
/Images
Is this correct?
Your current href is a relative path, rooted from where ever the HTML file is.
You can either use a correct, relative path...
<link href="../css/style2.css" rel="stylesheet" type="text/css">
Or you can use an absolute (domain-rooted) path...
<link href="/css/style2.css" rel="stylesheet" type="text/css">
... assuming your website is deployed at the root of your domain.
The link you have is relative, so it starts looking in the same folder as your html. You could do an absolute path to the css with /css/style2.css or use a relative path ../css/style2.css
Use relative URL <link href="../css/style2.css" rel="stylesheet" type="text/css">
The url css/style2.css should be relative to the HTML file(the file that contains code <link href="css/style2.css" rel="stylesheet" type="text/css">) .
.. in above relative URL indicates go one folder back, and then to the css folder - and in that css folder use style2.css file.
Similarly ../../ , means go two folders back and so on.