A Particular Image on a div not showing in localhost using ASP.net/IIS
Problem when i run it in localhost my header disappear, sometimes when i'm changing some code in #header it appears in design view but when run on localhost it's appearing as a big image and not following the correct height and width that i declare. the code that i will paste here is the one that is not showing either on design view and localhost.
Here is my Masterpage code:
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!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 id="Head1" runat="server">
<title>Untitled Page</title>
<link href="App_Themes/default/default.css" rel="stylesheet" type="text/css" runat="server" />
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<!--start of css div-->
<div id="outer">
<div id="upbg"></div>
<div id="inner">
<div id="header" runat="server">
</div>
<!--<div id="splash"></div>-->
<div id="menu">
<ul>
<li class="first"><a href="Default.aspx">Home</a></li>
<li><a href="#">Gallery</a></li>
<li><a href="#">Links</a></li>
<li><a href="About.aspx">About</a></li>
<li><a href="Contact.aspx">Contact</a></li>
</ul>
<div id="Login"><asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="false">
<AnonymousTemplate>
[ <a href="~/Account/Login.aspx" ID="HeadLoginStatus" runat="server">Log In</a> ]
</AnonymousTemplate>
<LoggedInTemplate>
Welcome <span class="bold"><asp:LoginName ID="HeadLoginName" runat="server" /></span>!
[ <asp:LoginStatus ID="HeadLoginStatus" runat="serve开发者_StackOverflowr" LogoutAction="Redirect" LogoutText="Log Out" LogoutPageUrl="~/"/> ]
</LoggedInTemplate>
</asp:LoginView> </div>
</div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
<asp:ContentPlaceHolder id="ContentPlaceHolder2" runat="server">
</asp:ContentPlaceHolder>
<div id="footer">
©Copyright © 2011 My Personal Werbsite. design by Migs Yandoc.
</div>
</div>
</div>
<!--end of css div-->
</div>
</form>
</body>
</html>
And here is my css code:
*
{
padding: 0px;
margin: 0px;
text-align: left;
}
body
{
background: #F9F9F7 url('images/a1.gif') repeat-x;
font-size: 11px;
font-family: "trebuchet ms", helvetica, sans-serif;
color: #8C8C73;
line-height: 18px;
}
a
{
color: #FF7800;
text-decoration: underline;
}
a:hover
{
text-decoration: none;
}
sup
{
font-size: 0.5em;
}
p
{
margin-bottom: 14px;
text-align: justify;
}
img.picA
{
position: relative;
top: -2px;
background: url('images/a47.gif') no-repeat;
width: 76px;
height: 74px;
padding: 8px;
}
img.picB
{
position: relative;
top: -2px;
background: url('images/a26.gif') no-repeat;
width: 146px;
height: 75px;
padding: 7px;
}
img.floatleft
{
float: left;
margin: 0px 14px 3px 0px;
}
ul.linklist
{
list-style: none;
}
ul.linklist li
{
border-top: solid 1px #EEEEEE;
padding-top: 5px;
margin: 5px 0px 0px 0px;
}
ul.linklist li.first
{
border-top: 0px;
margin-top: 0px;
padding-top: 0px;
}
#upbg
{
position: absolute;
top: 0px;
left: 0px;
background: #fff url('images/upbg.gif') no-repeat;
width: 747px;
height: 264px;
z-index: 1;
}
#outer
{
position: relative;
width: 747px;
margin: 0 auto;
background: #fff url('images/abg.gif') repeat-y;
}
#inner
{
position: relative;
padding: 13px 30px 13px 30px;
z-index: 2;
}
> #header {
> background: url ("~/images/a99.gif") no-repeat;
> position: absolute;
> width: 202px;
> height: 92px;
> color: #fff;
> padding-left: 20px;
> top: 14px;
> left: 32px;
> visibility: visible; }
#header span
{
font-weight: normal;
}
#header h1
{
position: absolute;
font-size: 23px;
letter-spacing: -1px;
top: 30px;
height: 92px;
}
#header h2
{
position: absolute;
font-size: 10px;
font-weight: normal;
color: #FCE2CA;
top: 51px;
}
#header sup
{
color: #FCE2CA;
}
The image is a99.gif! The size is right 202x92px.
Hope that you can help me cause I'm really stuck in this part.
Thanks in advance.
Respectfully yours, Migs
The ~ is not compiled to give the correct directory.
background: url ("~/images/a99.gif") no-repeat;
change it to
background: url ("images/a99.gif") no-repeat;
and its work if you have pages on the root dir and not on subdirectories.
The css file is a static file, that not change or compiled by asp.net.
加载中,请稍侯......
精彩评论