Relative addressing from CSS

I know that style sheets reference images with respect to their own location. So in the figure below, the style declaration  has to go through ../../ to reach the image in _images.

It seems like there ought to be a way for the style sheet to make reference to the root directory of the site, so it could just say something like /_images/Upay-Logo3.jpg, but this doesn't seem to work.  Is there a way to reference the root directory from a style sheet?

Thanks
relative-paths.png
stevaAsked:
Who is Participating?
 
level9wizardConnect With a Mentor Commented:
[steva]>>I'm not following you.

The web root will be different from server to server so you need to find out what yours is locally. There are many ways of doing this - if it's not obvious from your own server setup, you can print the web root thru a server side script. For example, in PHP you would do $_SERVER["DOCUMENT_ROOT"];


[steva]>>For me, none of the below work
                                 /_images/...
                                 /upay/_images/...
                                 /d:/upay/_images/...

/d:/upay is definitely wrong. Based on your screenshot above, I'm going to guess it's probably:
/websites/Upay/...
or
d:/websites/Upay/...


[steva]>> Keep in mind also that whatever I use for root has to work on my local system when I preview the page and also on the remote server after I upload the page.

That's going to be a matter of how your web-servers are configured, and with what root directory. For example, when I develop locally, my root path is "C:/wamp/www/" but on my live server it is /home/project/public_html/  (windows to linux). So if I wanted to move my files from local (having absolute paths) to live, I can expect things are going to break unless I make my remote server have the same webroot path.

This is why relative paths in these situations are more common, it allows us developers to move from development server to a live server seamlessly, without worrying about where that root directory is, but instead where each folder/asset is in relation to one another.
0
 
level9wizardCommented:
You have to find out what is the document root for the web server - for example, if upay is your document root, then what you have above would work; however, if d:\Websites is your web root, then the path would be: /upay/_images/Upay-Logo3.jpg


'/' will take you to the root public_html/web folder, even though the actual server path might be something like /home/user/public_html/
0
 
level9wizardCommented:
PS - I wrote /upay/_images/Upay-Logo3.jpg, keep in mind on *nix systems this will be case sensitive so /Upay/_images/Upay-Logo3.jpg
0
 
stevaAuthor Commented:
"You have to find out what is the document root for the web server - for example, if upay is your document root, then what you have above would work."

I'm not following you.   What I have above is the relative ../../ and that always works.  What I want is a simpler method that refers to the root. For me, none of the below work

                                 /_images/...
                                 /upay/_images/...
                                 /d:/upay/_images/...

Keep in mind also that whatever I use for root has to work on my local system when I preview the page and also on the remote server after I upload the page.

0
 
stevaAuthor Commented:
Yes.  I was hoping that there was some symbol that would always go to the root,  whether the site came from the local or remote server.  But I guess not.  I'll just use relative addressing.

Thanks for the discussion.  I gave you the points.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.