URL issue with sub directories

Question

I am creating a website with server side includes, and have multiple directories. For example in the head.html(it's an include) I am pointing the stylesheets as href="css/style.css" and it's works fine in the home page. but when I am trying to run a page inside the event (a folder/subdirectory) it's not taking the stylesheet. can anybody solve this out.

It's a pure HTML static website, can we use anything like clientResolveUrl or something like that?

Answer 1

If you're creating your project folder inside \wamp\www\sitename and include the css using

<link rel="stylesheet" type="text/css" href="/css/style.css" />

it will target the root folder, that is www in your case, not the sitename, so you should write it like this

<link rel="stylesheet" type="text/css" href="/sitename/css/style.css" />

but, you should probably use a Virtual Host so you can write it like the 1st one in your live site, here's the forum that explain how, and why you should be better using a Virtual Host

Answer 2

I think <base> tag can help in this case.

Definition and Usage

The tag specifies the base URL/target for all relative URLs in a document.

There can be at maximum one element in a document, and it must be inside the element.

http://www.w3schools.com/tags/tag_base.asp

Answer 3

I suggest you use your browser's web tools to check the path to that CSS file (or simply read the source code on your browser). You may then notice whether a subdirectory, or the parent directory, is missing from the relative path.

You may then need to change so that it becomes

<link rel="stylesheet" type="text/css" href="event/css/style.css" />

or

<link rel="stylesheet" type="text/css" href="../css/style.css" />

depending on the actual structure of files and directories.