CSS relative url to images

Question

I am developing on my localhost - http://localhost/mysite, and within that I have the following directory structure:

-assets
--css
---styles.css
--images
---background.png

Within the styles.css file, I would have something the following, which works fine on localhost

background-image: url(../images/background.png);

However, the live server works off a subdomain - http://test.liveserver.com. This means that the css rule has to change as follows:

background-image: url(/assets/images/loginlogo.png);

Not sure on the best way to get around this?

Right, for some reason, cssmin seems to be prepending a url when the css is minified on the live server. So, url(../images/background.png); becomes url(/test/assets/images/background.png); I need to investigate more — JonoB, Feb 21 '12 at 20:12
Bah, it appears that cssmin was indeed prepending a url when it did not need to. — JonoB, Feb 21 '12 at 20:21

score 11 · Accepted Answer · edited May 24 '14 at 07:08

11

With the directory tree you are providing you don't have to change your path.

.. means the parent directory of the CSS file so the assets/ directory is implied.

edited May 24 '14 at 07:08

NG_

answered Feb 21 '12 at 20:04

Spyros Mandekis

1 Answers1