Why aren't my CSS background images being displayed?

CSS background images require special tags that let the system know you are referring to an image that is managed by Cascade CMS. Consider the following lines in a CSS file:

.content{
    background-image: url('/images/photo.png');
}

To link to this image from the CSS file within Cascade, the following steps must to be taken:

• Click Edit on the CSS file containing the reference to the background image
• Add [system-asset] ... [/system-asset] tags around the full path to the image location inside of Cascade CMS. For example:

.content{
    background-image: url('[system-asset]/images/photo.png[/system-asset]');
}

• Click the Configure pane
• Check the box to Rewrite asset links in file. This option will force the system to attempt to locate anything within tags. Once it finds the asset, it will rewrite the link accordingly.
• Click Save & Preview
• After verifying your changes, click Submit

Assuming the system is able to locate the image in question, the rewritten link should look something like this:

background-image: url('/renderfile/4ed63b960a00018a0141055a46b50931/images/photo.png');