Hey all, I've just run into one more problem with my site... Each area is kept in it's own folder (mainly to keep things a bit tidy, but also to allow a simple PHP breadcrumb script to work...) . I have a PHP CSS Switcher running which allows the user to choose between two different styles (both exactly the same bar background really...) and am referencing my stylesheets with '../css/XXX.css' so that it will work from any folder.

The design works fine on my index page here, but when I call the same style sheets from another page for example from my videos page here it goes completely crazy and knocks all of my positioning elements out...

Does anyone know why this could be?

(here is a link to my CSS file if it helps!)

Your problem seems to be that you're using relative URLs as opposed to absolute URLs. For some reason, the prevailing wisdom among designers is to use relative URLs because it's "easier" from a design point of view and saves bandwidth, and among SEOs it's to use absolute URLs for issues of canonicalization (an absolute path defines one URL absolutely).

This is one of the rare times when the SEO community gets a design issue right, albeit for another reason in your case. The reason you want to use absolute URLs is because you use subfolders in your layout. By using absolute URLs, you can tell the server exactly where the CSS is, where the Javascripts are, etc. and so on. The increased bandwidth is marginal at best, and you're sure that your layout works every time.

My own trick is to have a variable called Page_Root (and another called Image_Root) in an include file, and define the paths for both localhost (my server) and the live server.

Sounds like the same problem that I had recently. Except with CSS you would use the URL path rather than the directory path.

This was explained later in the post.

Heres what your looking for (php)

PHP Code:

<LINK REL=StyleSheet HREF="http://<?php echo $_SERVER['HTTP_HOST'];?>/css/style.css" TYPE="text/css">

It works on my website. Just note that if an image isn't showing up you may need to apply the same PHP code to all images and background images inside the css document.


[unrelated] These reply boxes really need a word wrap feature, the entire paragraph spans the same line and extends the entire textarea...

Hey guys, thanks for the responses...


Unfortunately doesn't look like it's because of Relative URLS's... I'm now using absolute inks (targeting the CSS through basically a web address to my css file) and it is still not behaving...

Do you think it could be something to do with the PHP I am using?

remove the ../ and use root relative addressing.

because "/css/style.css" is the same no matter where the document is in the structure.

"../css/style.css" always means one directory above the current location.