CODEWITHSUNDEEP
cssasp.net-mvcbundling-and-minification
e4rthdog
e4rthdog

Reputation: 5223

CSS relative urls do not work when bundling in visual studio

In a css file i have this:

.social-icons li .facebook {
  background: url(../img/social/facebook.png) no-repeat;
}

The img directory is indeed in "../" compared to the css file.

Everything works ok if i include the css with normal markup in my _Layout.cshtml.

But if i use bundling:

bundles.Add(new StyleBundle("~/bundles/core-styles").Include(
        "~/assets/global/frontend/css/components.css"));

it breaks all images.

Is there any way to use bundling AND have correct images without of course touching the components.css?

Upvotes: 0

Views: 139

Answers (1)

Omri Aharon
Omri Aharon

Reputation: 17064

You can use CssRewriteUrlTransform when including the bundle:

bundles.Add(new StyleBundle("~/bundles/core-styles")
    .Include("~/assets/global/frontend/css/components.css", new CssRewriteUrlTransform()));

That class rewrites the URLs in the file to be absolute and it will fix your problem.

Upvotes: 1

Related Questions