There's no such thing as a stupid question, but they're the easiest to answer.
JoinTour
Login
 
Tag Cloud
access audio avg avg 8 bios blue screen boot bsod computer connection cpu crash css dell desktop dma driver drivers dvd email error excel explorer firefox firefox 3 freeze gimp graphics hard drive hardware hijackthis hjt install internet internet explorer itunes keyboard laptop macro malware monitor motherboard network networking outlook outlook 2003 outlook 2007 outlook express pio problem problems router seo server slow sound sp3 spyware trojan usb video virtumonde virus vista vundo windows windows vista windows xp winxp wireless
Web Design & Development
Search
Search in:
 
Advanced Search
Tech Support Guy Forums > Internet & Networking > Web Design & Development >
Solved: image in master page dissapears as soon as I save


HELLO AND WELCOME! Before you can post your question, you'll have to register -- it's completely free! Click here to join today! We highly recommend that you print a copy of our Guide for New Members. Enjoy!

 
Thread Tools
kinderyum's Avatar
Member with 59 posts.
 
Join Date: Jun 2007
08-Oct-2007, 11:34 PM #1
Solved: image in master page dissapears as soon as I save
Grrrr. I don't know why this has started happening! I create a new page from a master page (which contains an image) everything looks good until I go to save or preview it..the image dissapears! Please help!
kinderyum's Avatar
Member with 59 posts.
 
Join Date: Jun 2007
09-Oct-2007, 12:30 AM #2
I just moved the Master Page from it's sub-directory into the root directory and all is well again.
kinderyum's Avatar
Member with 59 posts.
 
Join Date: Jun 2007
09-Oct-2007, 01:08 AM #3
Well I spoke too soon, after I moved the Master Page into the root directory, the other pages started playing up. Anyways, after such googling I found the info below and fixed my problem by adding a runat="server" control in my image tag, which made it a server-side control (whatever that is! LOL)

Thought I'd post this info, incase it helps someone else.


Break Some URLs
Once again, let’s think back to the beginning of the article. At runtime, the master page and the content page are in the same control hierarchy – the master page is essentially a user control inside the content page. At design time, however, the master page and content page are two different entities. In fact, the master page and content page may live in different directories. During design time, it's easy to put URLs and relative paths into our master pages, but we have to be careful when using relative paths. Take the following master page excerpt as an example:.


<div>
<img src="logo.gif" alt="Company Logo" />

<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>

As long as the master page and the web form live in the same directory, the company logo will display in the browser. When the master page and web form live in different directories, the image will not appear. The browser requests knows nothing about master pages. The browser will interpret any relative paths it finds in the HTML as being relative to the webform. If our logo and master page files are in the root directory, but the web form is in a subdirectory, the browser will ask for logo.gif from the same subdirectory. The server will respond with a 404 (file not found) error.

The good news is, the ASP.NET runtime does provide a feature called “URL rebasing”. The runtime will try to “rebase” relative URLs it finds on server-side controls inside a master page. This means the following relative path will work, no matter where the master page and web form live.


<img src="logo.gif" alt="Company Logo" runat="server" />
We’ve added a runat=”server” attribute to the image tag, making the <img> a server-side control. When the master page file and logo are in the root directory, but the web form is in a subdirectory, the ASP.NET runtime will rebase the relative path it finds in the src attribute to point to the root of the website.

The following code will also work, because we are using a server-side Image object.


<asp:Image ImageUrl="logo.gif" runat="server" />
The ASP.NET runtime will also rebase paths it finds inside of the head tag. Take the following excerpt from a master page:


<head runat="server">
<title>Untitled Page</title>

<link href="styles/styles.css" type="text/css" rel="stylesheet"/>

</head>

If we request a webform from a subdirectory, the runtime will catch the href inside the link tag and rebase the URL to "../styles/styles.css". However, the runtime doesn’t catch everything. If we included our style sheet with the following code, the runtime won’t rebase the relative href.

<head runat="server">

<style type="text/css" media="all">
@import "styles/styles.css";
</style>

</head>
Also, the runtime doesn’t rebase URLs inside of embedded styles, and not all attributes are covered (the background attribute, for instance).


<body background="logo.gif" runat="server">
<!-- the background for the body tag will break -->
<form id="form1" runat="server">

<div id="Div1" style="background-image: url('logo.gif');" runat="server">
<!-- My background is also broken. -->
</div>

If you need to use a relative path in an area where the runtime does not provide the rebasing feature, you can compute a client side URL using ResolveClientUrl and passing a relative path. ResolveClientUrl, when called from inside a master page, will take into account the location of the master page, the location specified in the HTTP request, and the location specified by the relative path parameter to formulate the correct relative path to return.


<body background=<%= ResolveClientUrl("logo.gif") %> >
When working with image paths in embedded styles, it’s often a good idea to move the style definition into a .css file. The ASP.NET runtime will rebase the path it finds inside a link tag, so we won’t have any problems locating the stylesheet from any webform. Take the following style definition in a .css file:


body
{
background-image:url('images\logo.gif');
}
Relative paths are safe inside a .css file because the browser will always request logo.gif relative to the location of the stylesheet.
Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are Off
Refbacks are Off

You Are Using:
Server ID
Advertisements do not imply our endorsement of that product or service.
All times are GMT -4. The time now is 08:37 PM.
Copyright © 1996 - 2008 TechGuy, Inc. All rights reserved.
Powered by vBulletin, Copyright © 2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.1.0
Powered by Cermak Technologies, Inc.