Global variables in css style sheets

Question

I hava an absolute url in my stylesheet. http://localhost/images/myimage.jpg.

I also have a config class with the following constant

const SITE_ROOT = 'http://localhost/images'

On php pages i write config::SITE_ROOT . "/myimage.jpg" so when i move the site to the production server i can change the site root in one central location.

Is there any way to do this in my style sheet without putting it in the page? Relative url's are not an option because i am using mod rewrites and relative url's don't work.

Answer 1

You can write your SITE_ROOT constant into the CSS files by parsing them with PHP. Add this to .htaccess:

AddHandler application/x-httpd-php .css

Then embed PHP into the CSS files as you would do in any .php file.

Answer 2

There is no way to do this with CSS. If you want to do something like this you could make it a PHP file and use variables that way.

But couldn't you just use absolute URLs?

background-image: url(/images/myimage.jpg);

Will work on any server, is not relative, and will find the files from the root.