I'm sorry, but this doesn't work. If I put "runat=server" on the TD tag and then use the ~ notation to reference the background image, it does not work. The background image does not show up.
Also I tried putting "runat=server" in the body tag and got some very strange compile errors. So this does not seem like something you can do.
So this seems like something of a flaw in the Master Page model. Background images are used frequently in web sites, but the only way to reference them in a master page (if it is going to be used in subdirectories) is with my <%=imageFolder%> scheme or something
similar ... right?
I also ran into similar difficulties when I tried to reference a behaviors (? I think -- htc) file in a style sheet in the header. I had to prefix the file name with a public variable I called <%=homeDir%> that pointed to the home directory.
Not that it's difficult to do ... it just seems like an omission.
Hmm, interesting. I always thought the ~ was interpreted if the control was server based. A few tests proved otherwise, something I didn't now because I rarely do this; most of my stiff with images is done in CSS, which doesn't get around your problem. You
can use runat="server" on anything, which allows server-side programming, but it obviously doesn't interpret ~. Sorry for completely confusing you.
What I have, and that works, is this in my master (top level):
So how come the "../images/" doesn't fail when the master page is used in a subdirectory?
Or is the path relative to the location of the style sheet rather than the page?
Also, when I tried putting "runat=server" in the body tag of my application, I got 6 compile errors -- all of them were "Too many characters in character literal". 3 were in the MasterPage.master on line 1, column 1 (the Page directive?); the others were 3
different aspx pages that use this master page. Completely mysterious.
When accessing default.aspx all three images show, and when accessing foo\default.aspx the second two show. This is as expected.
The td background problem still remains though. Also runat="server" on the body tag doesn't cause errors for me. It could just be one of those psurious compiler errors that happen.
I also was able to get the "~" thing to work with "runat=server" on img tags and anchor tags. I also tried your scheme for putting the background images in the style sheet and that does work ... I thought it would not work in subdirectories but it did.
The only place I could not use "runat=server" was on anchor tags that had "onmouseover" and "onmouseout" using the Dreamweaver image rollover scheme, which involves naming the rollover image in the "onmouseover". Of course, then, this is another image that
needs to be made "non-relative" somehow. I tried making the "a" tag "runat=server" and using the tilde format, but (as I expected) that did not work. So in that one case I had to use my <%=imageFolder%> scheme.
Thanks for all the information about the tilde thing .. I know a lot more about that now. :)
That is because image path references in CSS files are relative to the CSS file itself, not the aspx page which loads the CSS file. So if you reference you body background in the CSS file, it wil display on every page, regardless of sub-directory.
In order to avoid issues like this, I use a program called IIS Admin. This program allows you to have multiple websites (witout virtual directories) on a single XP computer. This what you can use root relative paths for all of your images..
<img src="/images/image0.gif">
Hope this helps, I have never had any issues since I started using it.
CynthiaD
Participant
1000 Points
237 Posts
Re: Referencing images (path) in MasterPages
Jun 02, 2005 03:39 AM|LINK
Also I tried putting "runat=server" in the body tag and got some very strange compile errors. So this does not seem like something you can do.
Fredrik N
All-Star
29674 Points
5334 Posts
MVP
Re: Referencing images (path) in MasterPages
Jun 02, 2005 05:54 AM|LINK
If I remember correctly, you can only use the "~" with the System.Web.UI.WebControls and with some of the HtmlControl like the image etc.
MVP, ASPInsider, WCF RIA Services Insider
My Blog
CynthiaD
Participant
1000 Points
237 Posts
Re: Referencing images (path) in MasterPages
Jun 02, 2005 07:59 AM|LINK
I also ran into similar difficulties when I tried to reference a behaviors (? I think -- htc) file in a style sheet in the header. I had to prefix the file name with a public variable I called <%=homeDir%> that pointed to the home directory.
Not that it's difficult to do ... it just seems like an omission.
Dave Sussman
All-Star
37716 Points
5005 Posts
ASPInsiders
MVP
Re: Referencing images (path) in MasterPages
Jun 02, 2005 08:43 AM|LINK
Hmm, interesting. I always thought the ~ was interpreted if the control was server based. A few tests proved otherwise, something I didn't now because I rarely do this; most of my stiff with images is done in CSS, which doesn't get around your problem. You can use runat="server" on anything, which allows server-side programming, but it obviously doesn't interpret ~. Sorry for completely confusing you.
What I have, and that works, is this in my master (top level):
<div id="header">
<div id="logo" />
And in the stylesheet ( in /stylesheets)
#logo {
background: url(../images/logo.jpg);
...
}
I have content pages both at the top level and in sub-directories (Admin/ManageUsers.aspx for example) and the image appears correctly for both.
Dave
CynthiaD
Participant
1000 Points
237 Posts
Re: Referencing images (path) in MasterPages
Jun 02, 2005 03:48 PM|LINK
So how come the "../images/" doesn't fail when the master page is used in a subdirectory?
Or is the path relative to the location of the style sheet rather than the page?
Also, when I tried putting "runat=server" in the body tag of my application, I got 6 compile errors -- all of them were "Too many characters in character literal". 3 were in the MasterPage.master on line 1, column 1 (the Page directive?); the others were 3 different aspx pages that use this master page. Completely mysterious.
Dave Sussman
All-Star
37716 Points
5005 Posts
ASPInsiders
MVP
Re: Referencing images (path) in MasterPages
Jun 03, 2005 09:37 AM|LINK
OK, I've just done a test, with the following:
site.Master
Default.aspx (masterPageFile="~/site.master")
foo\default.aspx (masterPageFile="~/site.master")
In site.master I have:
<img src="images/foo.gif" />
<img src="~/images/foo.gif"runat="server" id="img2" />
<asp:Image ImageUrl="~/images/foo.gif" runat="server" id="img3" />
When accessing default.aspx all three images show, and when accessing foo\default.aspx the second two show. This is as expected.
The td background problem still remains though. Also runat="server" on the body tag doesn't cause errors for me. It could just be one of those psurious compiler errors that happen.
Dave
CynthiaD
Participant
1000 Points
237 Posts
Re: Referencing images (path) in MasterPages
Jun 03, 2005 06:32 PM|LINK
I also was able to get the "~" thing to work with "runat=server" on img tags and anchor tags. I also tried your scheme for putting the background images in the style sheet and that does work ... I thought it would not work in subdirectories but it did.
The only place I could not use "runat=server" was on anchor tags that had "onmouseover" and "onmouseout" using the Dreamweaver image rollover scheme, which involves naming the rollover image in the "onmouseover". Of course, then, this is another image that needs to be made "non-relative" somehow. I tried making the "a" tag "runat=server" and using the tilde format, but (as I expected) that did not work. So in that one case I had to use my <%=imageFolder%> scheme.
Thanks for all the information about the tilde thing .. I know a lot more about that now. :)
stormblast
Member
406 Points
46 Posts
Re: Referencing images (path) in MasterPages
Jun 28, 2005 07:46 AM|LINK
For <td background=""> and the body tag you have to use the <%=imageFolder%> workaround.
For everything else you can use "~" combined with runat="server".
However this should be pinned or filled into some kind of Knowledge Base, I had this problem, too, a while ago and I guess everyone will have it.
DavidRhodes
Participant
801 Points
187 Posts
Re: Referencing images (path) in MasterPages
Jun 28, 2005 11:54 AM|LINK
That is because image path references in CSS files are relative to the CSS file itself, not the aspx page which loads the CSS file. So if you reference you body background in the CSS file, it wil display on every page, regardless of sub-directory.
Philotech
Participant
1130 Points
227 Posts
Re: Referencing images (path) in MasterPages
Jul 05, 2005 05:14 PM|LINK
<img src="/images/image0.gif">
Hope this helps, I have never had any issues since I started using it.