asked on

using absolute paths in css files.

i have disorganized directories in my web project.

directory is like
www/myproject
........................./con.php
........................./index.php
........................./conf.php
........................./images/mainpage/1.jpg
........................./images/2.jpg
........................./css/style.css
........................./lib/functions.php
........................./lib/template/mainpage.php
........................./user/index.php
......................../admin/external/tech.php
----------------------------------------------------------------
in my style.css
#box{
      background-image:url(../images/mainpage/1.jpg);
}

#line{
      background-image:url(../images/2.jpg);
}

when i include this css file from /user/index.php it works fine but when i call this css from /admin/external/tech.php

is there any solution to make absolute paths for css files.
i want to make this
#box{
      background-image:url(/myproject/images/mainpage/1.jpg);
}

#line{
      background-image:url(/myproject/images/2.jpg);
}

i know how to do this in php files or in html via javascript. but i can not find any way to do this in css.

thanks.

FDMilwaukee

to use an absolute path you have to define it the following way = http://www.mydomain.com/myproject/images/mainpage/1.jpg

if your site is secure using ssl your path would look like this = https://www.etc, etc, etc

hope that helps

FDM

hielo

>>i want to make this
#box{
background-image:url(/myproject/images/mainpage/1.jpg);
}

#line{
background-image:url(/myproject/images/2.jpg);
}

Get rid of "/myproject":

i want to make this
#box{
background-image:url(/images/mainpage/1.jpg);
}

#line{
background-image:url(/images/2.jpg);
}

Member_2_4694817

As the syntax "url()" suggests, the part in bracket is a URL.
You may use relative URLSs ans in your example, i.e. url(foo1.jpg) or url(dir/foo2.jpg) or url(../foo3.jpg)
but also url(/absdir/foo4.jpg) and of course url(ftp://hostname/path/foo5.jpg)

Assuming your CSS file is retrieved as http://yourserver/something/cssdir/cssfile.css, the effect of the above examples is that the client will look for
http://yourserver/something/cssdir/foo1.jpg
http://yourserver/something/cssdir/dir/foo1.jpg
http://yourserver/something/foo3.jpg
http://yourserver/absdir/foo4.jpg
ftp://hostname/path/foo5.jpg

Relative path is always relative to the place where the containing file is, absolute path is from the webroot of the same webserver and with scheme and host you may even reference external resources.

phparmy

ASKER

i am asking how can i define this via javascript or etc. because i do not want to make changes in my css when i setup my web application to new server.

ASKER CERTIFIED SOLUTION

hielo

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

FDMilwaukee

to not make changes in your site when you upload it, you don't want to use absolute paths at all!!! You want to use relative paths!

Vinay Rajput

Hi phparmy,

I was wondering why css in your code is not working properly, even you already have correct directory structure of your project folders, can you please provide the link where your project is live,

so that i can help you out :D

Vinay Rajput

SOLUTION