Basic question

[wanapitei]

The following code is in the head and CSS is properly applied documents one layer down from the root. But it doesn't for documents two layers down. An identical document placed two steps down fails, yet its twin one step down works fine. What am I missing? Have yet to find an appropriate tutorial that addresses this issue.

Root -> Folder -> Doc that works
Root -> Folder -> Sub Folder -> Doc that doesn't work


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

Appreciated.

[BLiZZaRD]

Depends on the server set up, but you can try removing the ".." or use the never fail absolute URI (including the "http://" part.)

[TimFA]

Bliz, if your right and thats what he meant then ok. I though he meant ../ wasn't working one directory further in. So ../../ should...

[wanapitei]

Bliz, if your right and thats what he meant then ok. I though he meant ../ wasn't working one directory further in. So ../../ should...

Quite correct, it's working on one page and not on the other. It's been my assumption (and it's just that, an assumption) that the ../ directs the reference to begin from the root. If that were true then if that syntax works for one page, then it should work for another, one step further down. I'm assuming here that when the page looks for the CSS code it starts at the root and proceeds to look down to the address given.

Is this not a reliable syntax? Or have I misunderstood the ../ convention?

I should note here that I'm working both on my Mac and on my server (not a Mac) where the root is morleychalmers.com. I've set up within that a directory for the forthcoming website, a folder called MostlyTheravada. When the final server and domain is put together, it's the MostlyTheravada directory which will be the root of the website. On both my development computer and on my test site the CSS code is properly found with that syntax if it's one folder down, but not two.

I'd like to preserve the flexibility of relative paths and avoid hard coding absolute paths. Is this not an appropriate setting to develop a new site and domain?

Appreciated.

[boogyman]

Quite correct, it's working on one page and not on the other. It's been my assumption (and it's just that, an assumption) that the ../ directs the reference to begin from the root.
../x refers to some "x" located in the folder above the current folder of the script being executed.

so in your case ../stylesheet inside the "Doc that doesn't work"
if written in absolute terms refers to



root > folder > stylesheet





If that were true then if that syntax works for one page, then it should work for another, one step further down. I'm assuming here that when the page looks for the CSS code it starts at the root and proceeds to look down to the address given.

Is this not a reliable syntax? Or have I misunderstood the ../ convention?

I believe you mis-understood the convention. Whenever you use a relative path it starts from the folder the file being executed is in. So



Root > Folder > Doc that works

with the stylesheet declaration of


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

refers to


Root > styles.css




I should note here that I'm working both on my Mac and on my server (not a Mac) where the root is morleychalmers.com. I've set up within that a directory for the forthcoming website, a folder called MostlyTheravada. When the final server and domain is put together, it's the MostlyTheravada directory which will be the root of the website.
If this is a web site page that you are referring to, it doesn't matter because all web site page paths are declared the same way.



I'd like to preserve the flexibility of relative paths and avoid hard coding absolute paths. Is this not an appropriate setting to develop a new site and domain?

Appreciated.

Its not mandatory that you develop a new site.
You are correct, using relative paths for a document on the same domain are, in my subjective opinion, the best way to reference. However when a file is moved from folder A to folder B, it requires the developer to redo all of the relative paths due to the move. This is why I like using something called an absolute relative path. what I mean by that is use the domain as the "root" and go from there..
so from any folder on the website, if you start the relative path with a forward slash (/) it will actually start the link from the domain.

so for the website


www.dynamicdrive.com


with files


www.dynamicdrive.com/forums/thread.php
www.dynamicdrive.com/scripts/script.php
www.dynamicdrive.com/styles/css/style.php

with the same exact css external link declared as


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


would all refer to the file


www.dynamicdrive.com/css/stylesheet.css



I hope I didnt confuse you, but the moral is that if you are working on a web site page, and you wish to reference something using a relative path of the domain, use the forward slash, and it will start the anchor at the document root, which you than can drill down into the correct folder and file that you need

[wanapitei]

Hey Boogyman, yes that does confuse. It sounds like a rule to never move a page or re-organize a site because then all sorts of links become broken. Somehow that doesn't sound quite right. Change is always in the wind, surely that's the whole point of relative paths. So yes, I'm confused.

At any rate, tried your suggestion:


<link rel="stylesheet" type="text/css" href="/media/css/talk.css">
Doesn't work, either at level 1 or at level 2.

This also doesn't make sense — websites surely can have a file structure more than just one level deep. Being held to one level only would be so restrictive and tend to produce organizational clutter.

Hmmmm.

[Jas]

Moving pages can be done as boogyman said.

The ./ means the file is in the current folder. The ../ means the file is in a parent folder. So, if the page is:

mysite.com/folder1/folder2/folder3/file.html
Then you can link to another page in folder2 with:

../file.html
../AnotherFolder/file.html could point to mysite.com/folder1/folder2/AnotherFolder/file.html

Two dots just tell the broswer "The file isn't in the folder, or one of it's subfolders." So the browser goes backwards until it's found.

In this way, if I move a page, the relative path should pick it up. Also, if a foldername changes, it should have nearly no effect. But yes, some changes will need to be made if you change filenames of foldernames that effect the reletive path.
So, if you change:

mysite.com/folder1/folder2/folder3/file.html
to
mysite.com/SomethingElse/folder2/folder3/file.html
It probably won't have any effect on pages in folder3. But:

mysite.com/folder1/folder2/AnotherFolder/file.html
to:
mysite.com/folder1/folder2/SomethingElse/file.html
might if the link was something like
../AnotherFolder/file.html[/CODE]
Wow, thats hard to explain.

Anyway, your path says that the file is in the folder the page is in, plus the folder "media" plus the folder "css". It might help to explain where everything is in your site (i.e. this is where the page is, this is where the css file is.)

[wanapitei]

It's beginning to appear obvious I was under a misapprehension about the logic of ../, believing it to be an instruction to go back to the root.

Here's the structure. The CSS file is here:


mysite.com/media/css/talk.css

This is a text heavy site on different themes. Thus:


mysite.com/theme1/file.html
mysite.com/theme2/subtheme/file.html

It's been my assumption that a consistent instruction to the collection of CSS files could be established, no matter where on the site that file currently sits. From what you say above, it would appear such isn't available.

Appreciated.

[BLiZZaRD]

It's been my assumption that a consistent instruction to the collection of CSS files could be established, no matter where on the site that file currently sits.


Just like I said in my post... use the complete absolute URI. there is no need for ./ ../ ././ or any other. Just use



<link rel="stylesheet" type="text/css" href="http://yoursite.com/media/css/talk.css">

[wanapitei]

Just like I said in my post... use the complete absolute URI. there is no need for ./ ../ ././ or any other. Just use



<link rel="stylesheet" type="text/css" href="http://yoursite.com/media/css/talk.css">


Blindingly obvious, now. Much thanks for guiding me safely out of my own thicket.

Kind regards,

[TimFA]

I suppose I should have explained what I mean't, but I thought Bliz was right...