How to set a background image in html/ASP.net that will work even when the site is moved?

asp.net html visual-web-developer-2010
ispiro picture ispiro · Jun 13, 2012 · Viewed 8.6k times · Source

I'm trying to set an image as a background image. From what I've read – I need to have a tilde (~) before the address or the site won't function if put inside a folder. But though that works when I do the following (which doesn't get the result I want because it's not a background image):

<asp:Image ID="MyImage" runat="server" ImageUrl="~/images/Image1.png"/>

It doesn’t work in where I need it to work:

<body style="background-image: url(~/images/Image1.png) ; background-position: left top; background-repeat: no-repeat">

Adding that tilde there causes the image to disappear.

So how do I add the tilde to a background image? (And why doesn't it work there?)

EDIT: I tried having just:

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

(without the first forwardslash) but then any page inheriting from this page (which is a master page) didn't "find" the image.

Answer

graham mendick picture graham mendick · Jun 13, 2012

Things are easier if you move all your styles into css, that way you don't have any problems resolving URLs because they're all relative to the location of your stylesheet.

Related questions

How to change the text of a label?

I have a radiobutton list and on click on the radio button item I have to change the text of its label. But for some reason it's not working. Code is below: <asp:Label ID="lblVessel" Text="Vessel:" runat="…

Read More
WebForms UnobtrusiveValidationMode requires a ScriptResourceMapping for 'jquery'. Please add a ScriptResourceMapping named jquery(case-sensitive)

I'm building a web application using Visual Studio 2012. I'm attempting to add word count into my textbox. However after adding the the javascript codes and the html codes. I receive the error as stated above. Here is my javascript codeds …

Read More
How to hide columns in HTML table?

I have created a table in ASPX. I want to hide one of the columns based on the requirement but there is no attribute like visible in the HTML table building. How can I solve my problem?

Read More