Serving CSS from a static domain

Question

I want to serve my css and images from a static cookieless domain. Now my problem is how to point to the images from within my css files.

I don't want to program my domain hard within the css file, for example:

http://static.com/image.png

I would rather have a variable pointing to the the image, so it works for every static domain i use.

What is the best way for achieving this. Should i run the whole css file trough php and add the static domain in front of all the png references. A downside in this is that i have to place the whole css in html.

Or is there another more optimized way of doing this.

Answer 1

So long as the images come from the same server at the stylesheet, using relative URIs should be sufficient.

From the CSS Spec:

In order to create modular style sheets that are not dependent on the absolute location of a resource, authors may use relative URIs. Relative URIs (as defined in [RFC3986]) are resolved to full URIs using a base URI. RFC 3986, section 5, defines the normative algorithm for this process. For CSS style sheets, the base URI is that of the style sheet, not that of the source document.

There's an interesting essay by Bert Bos (one of the authors of the CSS spec) about variables in stylesheets. You can read it here.

Answer 2

When you pull the css from a static domain, relative URLs in the CSS will point to the very same domain. So you can just use relative paths and serve both css and images from that domain.