In my ASP.NET MVC application, I am referencing background images via CSS. When I run it in the dev environment, they show up fine. But when I deploy it (using IIS 7.5) the images do not load at all. I have tried every combination of relative paths and background/background-image CSS tags, but nothing works. Here is my file structure and CSS:
File structrue:
Content
CSS file
images
image.png
CSS:
background-image: url(/images/bsb_header2.png);
I have also tried ../images/bsb_header2.png and ../../images/bsb_header2.png to no avail.
What is really strange is when I try to go to the image directly (i.e. www.website.com/images/image.png), I am redirected to a login page. Perhaps there is some access or security setting I’m missing? I haven’t done anything with login controls yet (the default account view and controller are in my project but I haven’t done anything with them yet) and I can view all my other pages just fine.
Update: I FINALLY figured it out. The image file in question was encrypted. Right click the image file and navigate to properties, click the advanced button on the general tab, uncheck “Encrypt contents to secure data”, click OK, OK.
The tip off finally came when I noticed the file name was green in Windows Explorer. I see green file names all the time with no problems so I didn’t think anything of it. Then I noticed it was the only green file in the entire web app folder. Put two and two together and it worked instantly. Thanks everyone for your help.
I FINALLY figured it out. The image file in question was encrypted. Right click the image file -> properties -> advanced button on general tab -> uncheck “Encrypt contents to secure data” -> OK -> OK.
The tip off finally came when I noticed the file name was green in windows explorer. I see green file names all the time with no problems so I didn’t think anything of it. Then I noticed it was the only green file in the entire web app folder. Put 2 and 2 together and it worked instantly. Thanks everyone for your help.