ASP.NET MVC URL auto-resolution in CSS files

Question

In normal WebForms scenario, any root-relative URLs (e.g. ~/folder/file.txt) inside CSS files such as:

.form { background-image: url(~/Content/I         


        

Answer 1

One trick I have used in the past, was to actually make my CSS file have a .ASPX extension, and set the ContentType property in the page signature:

<%@ Page Language="C#" ContentType="text/css" %>

body {
    margin: 0;
    padding: 0;
    background: #C32605 url(<%= ResolveUrl("~/Content/themes/base/images/BodyBackground.png") %>) repeat-x;
    font-family: Verdana, Arial, sans-serif;
    font-size: small;
    color: #d7f9ff;
}

This will ensure that the CSS file goes through the ASP.NET framework, and replaces the server side code with your relative path.