Background image not displaying, please help

Question

5.00/5 (1 vote)

See more:

Hi Sir,

Please help me on setting the background image on my asp.net application.
The background image is not displaying, the image and my application are in the same directory but still not displaying. Here's my code below. Thank you in advance.

XML

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Logon.aspx.cs" Inherits="Logon" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<style type="text/css">
body
{
background-image:url('gtbackground.jpg');
background-repeat:no-repeat;
}
</style>
    <title>My Test Log-In Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <h3>
   <font face="Verdana">Logon Page</font>
</h3>
<table>
   <tr>
      <td>Email:</td>
      <td><input id="txtUserName" type="text" runat="server"/></td>
      <td><ASP:RequiredFieldValidator ControlToValidate="txtUserName"
           Display="Static" ErrorMessage="*" runat="server"
           ID="vUserName" /></td>
   </tr>
   <tr>
      <td>Password:</td>
      <td><input id="txtUserPass" type="password" runat="server"/></td>
      <td><ASP:RequiredFieldValidator ControlToValidate="txtUserPass"
          Display="Static" ErrorMessage="*" runat="server"
          ID="vUserPass" />
      </td>
   </tr>
   <tr>
      <td>Persistent Cookie:</td>
      <td><ASP:CheckBox id="chkPersistCookie" runat="server" autopostback="false" /></td>
      <td></td>
   </tr>
</table>
            <p>
                <asp:Button ID="cmdLogIn" runat="server" onclick="cmdLogIn_Click"
                    Text="Log-In" />
            </p>
<asp:Label id="lblMsg" ForeColor="red" Font-Name="Verdana" Font-Size="10" runat="server" />
    </div>
    </form>
</body>
</html>

Posted 6-Mar-11 20:37pm

Silver Lightning

Add a Solution

Comments

Silver Lightning 7-Mar-11 3:51am

Still no answer, please help me on this sir. Thanks

^That's Aragon 7-Mar-11 3:52am

It should be displayed. Make sure that image name and extension are correct.

Silver Lightning 7-Mar-11 4:11am

yes sir it is correct, in fact, it was displaying in design view, but when I'm running the application, it is not displaying. please help me sir. thanks

^That's Aragon 7-Mar-11 4:50am

Just check the view source of the page and check the path of the image. It should be displayed. If not then there must be some issue in the path/image name. You can use FireBug(for firefox) or google chrome(press ctrl + shift + j to view developer tool) for better diagnosis.

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Eduard Keilholz · Answer 1 · 2011-03-06T22:27:00

Solution 1

Hey guys,

Try removing the quotes in your stylesheet :

background-image:url('gtbackground.jpg');

should be

background-image:url(gtbackground.jpg);

Cheers!

Posted 6-Mar-11 22:27pm

Eduard Keilholz

Comments

Silver Lightning 7-Mar-11 4:37am

Hi Sir Eduard,

Still not displaying while application is running, but in design view it shows.

Sandeep Mewara · Answer 2 · 2011-03-06T22:32:00

Solution 2

it was displaying in design view, but when I'm running the application, it is not displaying.
It is clearly the relative path issue.

Your statement background-image:url('gtbackground.jpg'); is not working. Image is not present at desired location at runtime.

Start with putting the image one level up/down from the location and see. Once you get the relative path correctly for runtime display set it accordingly.

Posted 6-Mar-11 22:32pm

Sandeep Mewara

Comments

Silver Lightning 7-Mar-11 4:43am

I already did that sir, but still not displaying. What do you think should I revise? Thanks

Sandeep Mewara 7-Mar-11 4:48am

Try setting the image url at runtime.

Use this tip for reference: http://www.codeproject.com/Tips/62855/Resolving-Paths-in-a-Multi-Folder-WebSite.aspx