Firefox can't find external CSS using absolute file path - html

On my web page I have the following line in the <head> element:
<link type="text/css" href="C:/myApps/app1/images/css/12.02/main.css" rel="stylesheet" />
When I go to view that page in Firefox 11.0, it is obvious that the main.css is not being loaded. If I go to view page source, I see the <link> element (above) in the HTML, but when I click it I get the following error:
Firefox doesn't know how to open this address, because the protocol (c) isn't associated with any program.
How do I fix this?

try:
<link type="text/css" href="file:///C:/myApps/app1/images/css/12.02/main.css" rel="stylesheet" />
might work
Edit: as per the other answers, this is when you want to use a css file on your local machine, if the website will be hosted then you'll need to use a relative path.
<link type="text/css" href="images/css/12.02/main.css" rel="stylesheet" />
The above assumes that your html file with the link in is located in your "app1" folder.
Martyn

you need to insert an url/uri => file:///C:/myApps/app1/images/css/12.02/main.css

Hi you cas change your css path
<link type="text/css" href="C:/myApps/app1/images/css/12.02/main.css" rel="stylesheet" />
into
xxx.css replace into correct path
<link type="text/css" href="xxx.css" rel="stylesheet" />

Related

CSS style sheet not found

i spent the last hour figuring out why my style sheet is working.
enter image description here
I tried every possible way, but none of it works.
It just shows error 404 when i check it in the developer mode of my browser.
I tried
<link href="style.css" type="text/css" rel="stylesheet" />
<link href="./style.css" type="text/css" rel="stylesheet" />
<link href="../style.css" type="text/css" rel="stylesheet" />
<link href=".../style.css" type="text/css" rel="stylesheet" />
I also placed the the css file in the same file as my header.php.
The path to the css file is a relative path from the file that's called from the browser, and that's most likely not header.php.
If you start the path with a / it's considered relative to the webroot, so you probably want /css/style.css. Note that you cannot go up (using ../) from the webroot.
../ is meant to go back a folder so if my folder layout is
Root
css
style.css
includes
header.php
I have ho down a folder and enter the css folder like:
<link rel="stylesheet" href="../css/style.css">
You are using many link tag to integrate the css file in you html file. You should use one tag and it would be a relative path like the following <link rel="stylesheet" href="/css/style.css">

Bootstrap CSS not working on Github Pages, but works in localhost

I'm working on a portfolio and it looks great in localhost, but when I try to commit it to Github (https://gabrielbrickle.github.io/) the CSS does't work.
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="css/nivo-lightbox.css" rel="stylesheet" />
<link href="css/nivo-lightbox-theme/default/default.css" rel="stylesheet" type="text/css" />
<link href="css/animations.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet">
<link href="color/default.css" rel="stylesheet">
<link href="css/custom.css" rel="stylesheet">
try changing this:
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
to this:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
If you open the developer console(right click inspect element), It says youre trying to load from http in a https
Use https:// for bootstrap css Link.If you right click , Inspect and look at the Console in Chrome you'd find the errors.
Github is loaded over HTTPS. Referencing external stylesheets will require the same protocol.
You can see the errors in DevTools.
You can either save Bootstrap locally and reference it, or load it with HyperText Transfer Protocol Secure (HTTPS).
I had a similar issue. I messed around and figured out that I had referred to one of the sources incorrectly. I used the wrong case for the first letter of a folder of a source. I had used ./Assets/css (incorrect one) instead of ./assets/css (correct one). Fixing the error fixed the CSS on the Github site as well!

Why links not working in PhoneGap?

This trouble affects all loaded resources (internal links, img, css, js). I'm tried use this code for load css:
<link rel="stylesheet" href="/css/jquery.mobile.min.css" />
But he work only if I connected to server via browser. When I connect via PhoneGap app on phone, resources not loading.
After it, I tried this code:
<link rel="stylesheet" href="./css/jquery.mobile.min.css" />
And the same result..
How to solve this problem?
if your css file is in the www\css folder then use:
<link rel="stylesheet" type="text/css" href="css/index.css" />
this is how I got mine to work
You need to add the In App Browser Plugin.
plugin name="cordova-plugin-inappbrowser" spec="1.0.1" source="pgb"
Then run...
window.open("http://www.sitename.com", '_system');
Make sure that the css folder is inside the www folder and then remove the first slash /, like this:
<link rel="stylesheet" type="text/css" href="css/jquery.mobile.min.css" />

Updated template (.dwt) and index.html launching without CSS styling

I was handed a site to update at my job that utilizes one template file. I have made changes to both the template file and the index file as well as several CSS files. What happens when I launch the website live is that the sites contents appear without any styling/functionality. I believe I have linked to all the correct styling links in my head sections because in Dreamweaver the sites render perfectly fine in both Firefox and IE. I'm in a jam at my job. Any help is appreciated! Thanks
UPDATE: I selected the option from Dreamweaver's Modify menu: "Apply template to page" which corrected some of the CSS reference issues. The page renders perfectly now in IE 9 but still no styling whatsoever in Firefox. Any ideas from anyone? I'm completely stuck now. Thanks for all the answers so far!
Open Firefox developer tools, check the Network tab for any 404s, particularly on .css files. If there are any, that means it can't access the file.
The permissions on a directory could be wrong, the webserver (nginx/apache) might not be able to access it, or you may have linked it incorrectly (is your website in a subfolder or at the root of the domain? do your links need leading slashes?).
The path to the CSS files are incorrect, set them correctly (Absolute or Relative)
<link href="file://///hqdaa0n02731-06/wtc$/css/bs_paper/bootstrap.min.css" rel="stylesheet" type="text/css" media="screen, min-device-width, resolution" />
<link href="file://///hqdaa0n02731-06/wtc$/js/plugins/css/bootstrap-accessibility_1.0.3.css" rel="stylesheet" type="text/css" />
<link href="file://///hqdaa0n02731-06/wtc$/css/print.css" rel="stylesheet" type="text/css" media="print" />
<link href="file://///hqdaa0n02731-06/wtc$/css/wtc_home_3box_pic_option.css" rel="stylesheet" type="text/css" />
<link href="file://///hqdaa0n02731-06/wtc$/css/yamm_2014.css" rel="stylesheet" type="text/css" />
Should be like this:
ABSOLUTE
<link href="http://www.wtc.army.mil/css/yamm_2014.css" rel="stylesheet" type="text/css" />
RELATIVE
<link href="/css/yamm_2014.css" rel="stylesheet" type="text/css" />

How to access the file using the relative path

I've got the following folder hierarchy in my web application.
I'm using the following relative path to access my CSS files but the layout doesn't detect the CSS. There are two layouts but I'm calling the CSS from the layout file which resides inside the views folder.
This is the path I used to access the CSS file.
<link rel="stylesheet" type="text/css" href="../style/style.css">
I used this path too but no luck.
<link rel="stylesheet" type="text/css" href="../../style/style.css">
Please help!
Check whether you are not using multiple CSS files. And if you are using Chrome/FF you can check whether your CSS is called or not with tools like firebug.
You can see the full path with these tools.
if your layout file loading in another file try that files path or simply use path like this
<head>
<link href="/style/style.css" rel="stylesheet" type="text/css" />
</head>
your real layout can be work like this too
<head>
<link href="style/style.css" rel="stylesheet" type="text/css" />
</head>
You can use this:
<link type="text/css" href="style/style.css" rel="stylesheet" />
The second Path should be correct.
I also tried it in Visual Studio 2010 with the same folders as you and VS gives me the same Path (Second one) as you said.
Another Question, do you put the link into the header of the HTML page ?
<head>
<link href="../../style/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
</body>