I have a local HTML file which has a link to a local CSS file. Both files are on machine A. The HTML is in one location but the CSS is stored elsewhere on machine A. The HTML file is a report generated by a program running on machine A. The user reads the HTML report on machine A.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>My very first html document</title>
<link rel="stylesheet" type="text/css" href="C:\tmp\folder1\css\mystyle.css" />
</head>
<body>
<div class="myclass" >Hello World!</div>
</body>
</html>
CSS mystyle.css
.myclass {
background-color: yellow;
}
The folder structure is like so:
C:
+
+->tmp
+
+>folder1
| +
| +>css
| +
| +>mystyle.css
+>folder2
+
+>index.html
In Firefox the CSS is not applied. The results from Firefox, Chrome, IE, Edge (clockwise).
Version of Firefox: 63.0.3 (64bit)
What I have tried
I would prefer the absolute path for the CSS. I would prefer not to copy the CSS.
Questions
Prepend file:// to the href of your css link and it will work. I just tried it myself using your folder structure. It originally didn't work in Firefox as reported but it did work in Chrome. Prepending file:// allows it to work on both.
<link rel="stylesheet" type="text/css" href="file://C:/tmp/folder1/css/mystyle.css" />
file:/// prefixed path). The best solution here is obviously the quickest and easiest. If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With