Question

I have a site located at http://www.mySite.com. My html / PHP pages and CSS are located at http://www.mySite.com/index.php and http://www.mySite.com/stylesheet.css. And all is grand! But I have started to need a bit more functionality and have added pre-coded pages/packages, like a blog. These packages are located in their own directories like http://www.mySite.com/blog.

The problem is the from the new package directories the css image links are no longer pointing to the correct URL because of the directory change. I understand why this is happening but cannot figure out a work around other than maintaining 2 separate stylesheets, which seems wrong.

Answer 1

I think you’re probably using a ‘current directory’ relative path convention, when you need to use a ‘application directory’ relative path convention, the difference is this:

src="path/to/file.ext"

And

src="/path/to/file.ext"

In the first case we’re looking for the file from the current directory downwards (depending on the path parts), whereas in the latter case we’re looking for the file from the root application directory (or virtual directory) downwards (again, depending on the path parts).

The bottom line is that with a leading forward slash on a relative path your resource will be resolvable from the root.