skip to Main Content

I have some local html files which have relative paths for style sheets and javascript:

<link href="/css/rendering.css" rel="stylesheet">
<script type="text/javascript" src="/script/task.js"></script>

With a <base> href set, the css works, but the script does not, if I set a full path on the script it works (and it’s the correct path if I was using <base>).

The css and javascript are hosted on a web server, the html files are held on a local drive.

<base href="http://example.com/myservice/public" >

Resources behind /public (the css and javascript) do not require any Authentication.

I don’t generate the html files, but I’m looking for the easiest option to make them work locally so the inclusion of the <base> seemed like the logical solution instead of having to edit the src.

Any ideas why this would not work?

2

Answers


  1. You need to use relative URLs, so not starting with a "/":

    <link href="css/rendering.css" rel="stylesheet">
    <script type="text/javascript" src="script/task.js"></script>
    

    I tried it, this small change makes local CSS and Script files work in Edge + Chrome + Firefox, even without <base href> present.

    Login or Signup to reply.
  2. <link href="css/rendering.css" rel="stylesheet">
    <script src="script/task.js"></script>

    If you’re working with local HTML files and facing issues with relative paths, it’s because browsers treat relative paths differently when loading files directly from the file system (e.g., file:// path) compared to loading from a server…
    so once try this one :

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search