Relative paths in IIS 7 Web applications under a website

Question

Is there a way to force "Paths" in a web-application under a website to resolve to actual paths under the app, rather than the site?

I'm new so I can't upload an image of what I'm talking about, but see if you can visualize my IIS setup:

IIS 7.0
----MAIN WEB SITE:
    ----Web App #1
    ----Web App #2

Each web app has its own CSS, pointing to its own images; for example in Web App #1:

background-image: url(images/someimage.png)

The problem is, since web app is installed under a main site, "images/someimage.png" resolves to the image folder of the main site, not web app #1.

How can I fix this?

Answer 1

Try this first

There is something about "Paths" for Asp.net beginners

UPDATE(as I'm struggling with this too):

Besides code behind MapPath("~/..."), my focus was only from HTML/CSS point of path resolution

I noticed if we talking about HTML

<img src="/images/x.jpg" />  this will work only from  

IIS 7.0
----MAIN WEB SITE

The slash "/" in front of "images" will be interpreted "go to root"

to fix for

IIS 7.0
----MAIN WEB SITE
    ----Web App #1

remove "/" so <img src="images/x.jpg" /> this will work for both, when hosted as site and when hosted as web application

Now CSS is tricky different way, I was surprised that using your example it doesn't work since there is no slash in front of the images.

consider a structure based on your expample

IIS 7.0
----MAIN WEB SITE:
    ----Web App #1
        ----styles
        ----images

Your CSS

background-image: url(images/someimage.png)

tells the browser to look for MAIN WEB SITE/Web App #1/styles/images/someimage.png

add "/" background-image: url(/images/someimage.png)

the result is MAIN WEB SITE/images/someimage.png

now add "../" background-image: url(../images/someimage.png)

the result is MAIN WEB SITE/Web App #1/images/someimage.png

(seems like resolved as go one level up, and then go to images)

The good part is, that once you change those prefixes to make it work as web application it seems to work even when hosted as actual web site if you need to do so

IIS 7.0
----MAIN WEB SITE (web app #1):
    ----styles
    ----images

[Sorry if this answer is not descriptive enough or messy, I will add edits when someone will propose or if I notice mistakes myself, generally firefox/chrome F12 and see paths for resources]

Answer 2

I add "runat="server"". Like this:

<a href="~/Default.aspx" runat="server">Home</a>