MVC Content Folder urls in css not rendering the same between localhost and production server

Question

Im sure this question has been asked somewhere else but I cannot seem to get my google foo to work today.

here is my directory structure

My problem is that in my css, image urls do not render correctly between localhost and the production server

example 1
works on local host but not production server
background:url(../Images/mybackground.jpg)  

example 2
works on server but not localhost
background:url(../Content/Images/mybackground.jpg)

Can someone explain why Example1 does not work on the server?

take a look at this - https://stackoverflow.com/questions/20484188/mvc-bundling-and-css-relative-urls/20491803 - maybe it can help you — Mauricio Gracia Gutierrez, Feb 14 '18 at 14:57

score 0 · Answer 1 · answered Feb 14 '18 at 19:53

The link given by Mauricio Gracia Gutierrez helped solve this. Thank you.

It ends up that The number of directories need to be the same as how you reference it with the bundles along with names being different.

Example
using this structure

bundle.cs

  bundles.Add(new StyleBundle("~/one/two").Include("~/Content/Css/site.css");

Layout.cshtml

 @Styles.Render("~/one/two")

1 Answers1