Footer jumps when hovered over Dynamic Menu Item

varunbwj · October 14th, 2009, 10:55 AM

Hi....

I want the footer to stay at the bottom of page all the time....

But, whenever i hover mouse over dynamic menu item, footer jumps above the "MainContent" or "cpMaincontent"....

The Style sheet i have used for my website is:

Code:

*
{
    font-family: Pristina;
    font-size: xx-large;
    font-weight: bold;
    color: #FFFFFF;
    text-align: left;
    list-style-type: georgian;
    list-style-image: url('~/Images/round3.gif');
    margin-bottom: 2px;
    margin-right: 0px;
}

body
{
    margin: 10px 0 0 0;
    color: #FF6600;
    background-color: #FF6600;
}

a
{
	color: #40D72F;
	text-decoration: none;
	
}


h1
{
   font-size : large;
}


#PageWrapper
{
    width: 1010px;
    background-color: #FF6600;
    height: 321px;    
}

#Header
{
    margin: 0px;
    padding: 0px;
    background-image: url('Images/red_sky_bg3.JPG');
    width: 1000px;
    height: 101px;
    font-size: 30;
    font-weight: bolder;
    background-repeat: no-repeat;
    background-color: #800000;
    position: relative;
    top: -15px;
    left: 1px;
    line-height: 35px;
    font-family: 'Comic Sans MS';
    color: #FFFF00;
}
.Header
{
    margin: 0px;
    padding: 0px;
    background-image: url('Images/red_sky_bg3.JPG');
    width: 1000px;
    height: 101px;
    font-size: 30;
    font-weight: bolder;
    background-repeat: no-repeat;
    background-color: #800000;
    position: relative;
    top: -15px;
    left: 1px;
    line-height: -70px;
    font-family: 'Comic Sans MS';
    color: #FFFFFF;
}


#MenuWrapper
{
    background-image: url('Images/MenuSubPlainBack11.jpg');
    width: 815px;
    height: 85px;
    padding-top: 7px;
    padding-left: 17px;
    margin-left: 30px;
    background-repeat: no-repeat;
}

#MenuWrapper a
{
    color: #FFFFFF;
    font-family: Pristina;
    font-size: x-large;   
}

.MainMenu
{
    width: 814px;
    height: 19px;
    font-size: xx-large;    
    font-family: Pristina;
    color: #FFFFFF;
   /* background-image: url('Images/MainMenuPlainBack1.jpg');    */
    background-color: #EC4904;
    background-attachment: fixed;
}

#MainContent
{
    width: 650px;   
    float: left;
    min-height: 500px;
    /*padding: 10px; */
    background-color: #FF6600;    
    /*margin-top: 49px;
    margin-left: 25px;*/
    margin-bottom:200px;
    /*padding-bottom:150px;*/
}

#Sidebar
{
    border: medium solid #800000;
    font-size: 0.8em; /*background-image: url('Images/SidePlainback.jpg');*/
    background-repeat: no-repeat;
    width: 200px;
    min-height: 500px;
    position: relative;
    left: -23px;
    top: 53px;
    float: right;
    right: 23px;
    height: 48px;
    background-color: #EC4904;
   margin-left:0px;
}

#Footer
{
    clear: both;
    height: 36px;
    background-color: #800000;
    text-align: center;
    font-size: x-large;    
    line-height: 37px;
    width: 1008px;
    margin-top: 50px;
    background-image: url('Images/red_sky_bg2.JPG');
    left: 0px;
    bottom: 0px;
}

.StaticMenuItemStyle, .StaticMenuItemStyle a
{
    color: #FFFFFF;
    font-size: xx-large;
    font-weight: bold;
    text-decoration: none;
    padding-left: 2px;
    font-family: Pristina;
}

.StaticHoverStyle, .StaticSelectedStyle
{
	background-color: #c1e4ce;
	text-decoration: none;
}

.DynamicMenuItemStyle
{
	font-size: 14px;
	color: #707070;
	font-size: x-large;
	padding: 4px 2px 4px 3px;
}

.DynamicHoverStyle
{
	background-color : Gray;
	color:White;
	text-decoration: none;
}

.DynamicHoverStyle a
{
	background-color : Gray;
	color:White;
	text-decoration: none;
}

.DynamicMenuStyle
{
    z-index: 1000;
    background-image: url('Images/MainMenuPlainBack1.jpg');
    font-size: x-large;   
}

The Master Page of my site is:

Code:

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<%@ Register src="Controls/Banner.ascx" tagname="Banner" tagprefix="uc1" %>

<!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">
    <title></title>
    <asp:ContentPlaceHolder id="head" runat="server">
    </asp:ContentPlaceHolder>
    <link href="App_Themes/SkinFile1/SkinFile1.css" rel="stylesheet" type="text/css" />

    <style type="text/css">
        .style1
        {
            color: #FFFFFF;
            font-weight: bold;
        }
        .style2
        {
            color: #FFFFFF;
            font-weight: bold;
            font-size: 45pt;
        }
    </style>

    <link href="Styles/StyleSheet.css" rel="stylesheet" type="text/css" />
</head>

<body>
    <form id="form1" runat="server">
        <div id="PageWrapper">        
            <div id="Header"> 
	<span class="style2">Website Name...</span>
            </div>                        
            <div id="MenuWrapper">
                <asp:Menu ID="Menu1" runat="server" CssClass="MainMenu" 
                    DataSourceID="SiteMapDataSource1" DynamicHorizontalOffset="2" 
                    Font-Names="Pristina" Font-Size="0.8em"  
                    Orientation="Horizontal" StaticEnableDefaultPopOutImage="False" 
                    StaticSubMenuIndent="10px" Width="16px" BorderStyle="None" Height="38px" EnableViewState="True">
                    <StaticSelectedStyle />
                    <StaticMenuItemStyle HorizontalPadding="15px" ItemSpacing="10px" 
                        VerticalPadding="2px" BorderStyle="Ridge" BorderWidth="1 px" />
                    <DynamicHoverStyle />
                    <DynamicMenuStyle CssClass="DynamicMenuStyle" />
                    <DynamicSelectedStyle />
                    <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" BorderStyle="Solid" BorderWidth="1 px"/>
                    <StaticHoverStyle />               
                </asp:Menu>  
                 <asp:SiteMapPath ID="SiteMapPath1" runat="server" Font-Names="Pristina" 
                Font-Size="Large" PathSeparator=" : " Font-Underline="True">
                <PathSeparatorStyle Font-Bold="True" />
                <CurrentNodeStyle />
                <NodeStyle Font-Bold="False"  />
                <RootNodeStyle Font-Bold="False" />
            </asp:SiteMapPath>
            </div>
           
            <div id="MainContent">                 
	            <asp:ContentPlaceHolder ID="cpMainContent" runat="server">                
	            </asp:ContentPlaceHolder>
            </div>         
               
            <div id="Sidebar">             
                <uc1:Banner ID="Banner1" runat="server" />
            </div>
                
            <div id="Footer">
                <asp:LoginName ID="LoginName1" runat="server" FormatString="Logged in as {0}" />
                <asp:LoginView ID="LoginView1" runat="server">
                     <LoggedInTemplate>
                  (<asp:LoginStatus ID="LoginStatus1" runat="server" />)
              </LoggedInTemplate>
                     <AnonymousTemplate>
                         U are not logged in...
                     </AnonymousTemplate>
             </asp:LoginView>
           </div>
            
        </div>
            
            <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" 
                    ShowStartingNode="False" />
        
    </form>
</body>
</html>

I am not getting whats making the footer jump....
I m not getting where i have done wrong....

Please tell me my mistake which is making the footer jump...
And also, what should i be doing to make it freeze at bottom...

Thanks in advance...

Imar · October 14th, 2009, 03:58 PM

Hi there,

Is this all custom code or do you have the same problem with the code that comes with the book?

Is there a place where I can view this on-line?

Imar

varunbwj · October 14th, 2009, 11:24 PM

Hi Imar...

There is no problem with the code that comes with the book...

I m trying to do this new website after completing your book and i m following the concepts and codes of your book again... Then i am trying to change the code (one by one) so as to get familiarized with ASP...

I will try to extract the problem (footer jump) and send all the required parts of website (to this forum).....
This website which i m trying to do is not available online....

Thanks for your support each time....

Thanks a lot, Imar...

varunbwj · October 15th, 2009, 12:25 PM

Hi Imar....

This is the code which i could extract which is having the problem...

Solution Explorer is as follows:

WEBSITE NAME : FooterProb

App_Themes : SkinFile1 : SkinFile1.css

Default.aspx
Default.aspx.cs

MasterPage.master

web.config

Web.sitemap

SkinFile1.css is as follows :

Code:

*
{
    font-family: Arial;
    font-size: xx-large;
    font-weight: bold;
    color: #FFFFFF;
    text-align: left;
    list-style-type: georgian;    
    margin-bottom: 2px;
    margin-right: 0px;
}

body
{    
    margin: 10px 0 0 0;
    background-color: #006600;
}

#PageWrapper
{
    width: 1010px;
    background-color: #006600;
    height: 321px;    
}

#Header
{
    margin: 0px;
    padding: 0px;    
    width: 1000px;
    height: 101px;
    font-size: 30;
    font-weight: bolder;
    background-repeat: no-repeat;
    background-color: #000000;
    position: relative;
    top: -15px;
    left: 1px;
    line-height: 35px;
    font-family: 'Comic Sans MS';
    color: #FFFF00;
}

#MenuWrapper
{
    background-image: url('Images/MenuSubPlainBack11.jpg');
    width: 815px;
    height: 85px;
    padding-top: 7px;
    padding-left: 17px;
    margin-left: 30px;
    background-repeat: no-repeat;
}

#MenuWrapper a
{
    color: #FFFFFF;
    font-family: arial;
    font-size: x-large;   
}

.MainMenu
{
    width: 814px;
    height: 19px;
    font-size: xx-large;    
    font-family: arial;
    color: #FFFFFF;  
    background-color: #EC4904;
    background-attachment: fixed;
}

#MainContent
{
    width: 650px;   
    float: left;
    min-height: 500px;
    padding: 10px; 
    background-color: #006600;    
    margin-top: 49px;
    margin-left: 25px;
    margin-bottom:200px;
    padding-bottom:150px;
}

#Footer
{
    clear: both;
    height: 36px;
    background-color: #000000;
    text-align: center;
    font-size: x-large;    
    line-height: 37px;
    width: 1008px;
    margin-top: 50px;    
    left: 0px;
    bottom: 0px;
}


.StaticMenuItemStyle, .StaticMenuItemStyle a
{
    color: #FFFFFF;
    font-size: xx-large;
    font-weight: bold;
    text-decoration: none;
    padding-left: 2px;
    font-family: arial;
}

.StaticHoverStyle, .StaticSelectedStyle
{
	background-color: #c1e4ce;
	text-decoration: none;
}

.DynamicMenuItemStyle
{
	font-size: 14px;
	color: #707070;
	font-size: x-large;
	padding: 4px 2px 4px 3px;
}

.DynamicHoverStyle
{
	background-color : Gray;
	color:White;
	text-decoration: none;
}

.DynamicHoverStyle a
{
    background-color : Gray;
	color:White;
	text-decoration: none;
}


.DynamicMenuStyle
{
    z-index: 1000;
    background-image: url('Images/MainMenuPlainBack1.jpg');
    font-size: x-large;
}

Default.aspx is as follows:

Code:

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">

</asp:Content>

Default.aspx.cs is as follows:

Code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
}

MasterPage.master is as follows:

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 runat="server">
    <title></title>
    <asp:ContentPlaceHolder id="head" runat="server">
    </asp:ContentPlaceHolder>
    <link href="App_Themes/SkinFile1/SkinFile1.css" rel="stylesheet" 
        type="text/css" />
    <style type="text/css">
        .style2
        {
            color: #FFFFFF;
            font-weight: bold;
            font-size: 45pt;
        }
    </style>
    
</head>
<body>
    <form id="form1" runat="server">
        <div id="PageWrapper">        
            <div id="Header" >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span 
                    class="style2"><br /></span></div>                        
            <div id="MenuWrapper">
                <asp:Menu ID="Menu1" runat="server" BackColor="#3e3e3e" CssClass="MainMenu" 
                    DataSourceID="SiteMapDataSource1" DynamicHorizontalOffset="2" 
                    Font-Names="arial" Font-Size="0.8em" ForeColor="#666666" 
                    Orientation="Horizontal" StaticEnableDefaultPopOutImage="False" 
                    StaticSubMenuIndent="10px" Width="16px" BorderStyle="None" Height="38px" EnableViewState="True">
                    <StaticSelectedStyle BackColor="#000000" />
                    <StaticMenuItemStyle HorizontalPadding="15px" ItemSpacing="10px" 
                        VerticalPadding="2px" BorderStyle="Ridge" BorderColor="#993333" BorderWidth="1 px" />
                    <DynamicHoverStyle BackColor="#000000" ForeColor="White" />
                    <DynamicMenuStyle BackColor="#333333" CssClass="DynamicMenuStyle" />
                    <DynamicSelectedStyle BackColor="#000000" />
                    <DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" BorderStyle="Solid" BorderColor="Black" BorderWidth="1 px" BackColor="#3e3e3e"/>
                    <StaticHoverStyle BackColor="#000000" ForeColor="White" />
                
                </asp:Menu>  
                 <asp:SiteMapPath ID="SiteMapPath1" runat="server" Font-Names="arial" 
                Font-Size="Large" PathSeparator=" : " Font-Underline="True">
                <PathSeparatorStyle Font-Bold="True" ForeColor="#bb0000" />
                <CurrentNodeStyle ForeColor="#333333" />
                <NodeStyle Font-Bold="False" ForeColor="#bb0000" />
                <RootNodeStyle Font-Bold="False" ForeColor="#bb0000" />
            </asp:SiteMapPath>
            </div>
           
            <div id="MainContent">                 
                <asp:ContentPlaceHolder ID="cpMainContent" runat="server">                
                </asp:ContentPlaceHolder>
            </div>  
                
            <div id="Footer">
            </div>
            
            <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" 
                    ShowStartingNode="False" />
        
    </form>
</body>
</html>

web.config is as follows:

Code:

<?xml version="1.0"?>

<configuration>


    <configSections>
        <sectionGroup name="system.web.extensions" type="System.Web.Configuration.SystemWebExtensionsSectionGroup, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35">
            <sectionGroup name="scripting" type="System.Web.Configuration.ScriptingSectionGroup, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35">
                <section name="scriptResourceHandler" type="System.Web.Configuration.ScriptingScriptResourceHandlerSection, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" allowDefinition="MachineToApplication"/>
                <sectionGroup name="webServices" type="System.Web.Configuration.ScriptingWebServicesSectionGroup, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35">
                    <section name="jsonSerialization" type="System.Web.Configuration.ScriptingJsonSerializationSection, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" allowDefinition="Everywhere" />
                    <section name="profileService" type="System.Web.Configuration.ScriptingProfileServiceSection, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" allowDefinition="MachineToApplication" />
                    <section name="authenticationService" type="System.Web.Configuration.ScriptingAuthenticationServiceSection, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" allowDefinition="MachineToApplication" />
                    <section name="roleService" type="System.Web.Configuration.ScriptingRoleServiceSection, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" requirePermission="false" allowDefinition="MachineToApplication" />
                </sectionGroup>
            </sectionGroup>
        </sectionGroup>
    </configSections>


    <appSettings/>
    <connectionStrings/>
    <system.web>
        
        <compilation debug="false">

            <assemblies>
                <add assembly="System.Core, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
                <add assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
                <add assembly="System.Data.DataSetExtensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
                <add assembly="System.Xml.Linq, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
            </assemblies>

        </compilation>
        
        <authentication mode="Windows" />
        


        

        <httpHandlers>
            <remove verb="*" path="*.asmx"/>
            <add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
            <add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
            <add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" validate="false"/>
        </httpHandlers>
        <httpModules>
            <add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
        </httpModules>


    </system.web>

    <system.codedom>
        <compilers>
            <compiler language="c#;cs;csharp" extension=".cs" warningLevel="4"
                      type="Microsoft.CSharp.CSharpCodeProvider, System, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089">
                <providerOption name="CompilerVersion" value="v3.5"/>
                <providerOption name="WarnAsError" value="false"/>
            </compiler>
            <compiler language="vb;vbs;visualbasic;vbscript" extension=".vb" warningLevel="4"
                      type="Microsoft.VisualBasic.VBCodeProvider, System, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089">
                <providerOption name="CompilerVersion" value="v3.5"/>
                <providerOption name="OptionInfer" value="true"/>
                <providerOption name="WarnAsError" value="false"/>
            </compiler>
        </compilers>
    </system.codedom>

    
    <system.webServer>
        <validation validateIntegratedModeConfiguration="false"/>
        <modules>
            <remove name="ScriptModule" />
            <add name="ScriptModule" preCondition="managedHandler" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
        </modules>
        <handlers>
            <remove name="WebServiceHandlerFactory-Integrated"/>
            <remove name="ScriptHandlerFactory" />
            <remove name="ScriptHandlerFactoryAppServices" />
            <remove name="ScriptResource" />
            <add name="ScriptHandlerFactory" verb="*" path="*.asmx" preCondition="integratedMode"
                 type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
            <add name="ScriptHandlerFactoryAppServices" verb="*" path="*_AppService.axd" preCondition="integratedMode"
                 type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
            <add name="ScriptResource" preCondition="integratedMode" verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
        </handlers>
    </system.webServer>

    <runtime>
        <assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
            <dependentAssembly>
                <assemblyIdentity name="System.Web.Extensions" publicKeyToken="31bf3856ad364e35"/>
                <bindingRedirect oldVersion="1.0.0.0-1.1.0.0" newVersion="3.5.0.0"/>
            </dependentAssembly>
            <dependentAssembly>
                <assemblyIdentity name="System.Web.Extensions.Design" publicKeyToken="31bf3856ad364e35"/>
                <bindingRedirect oldVersion="1.0.0.0-1.1.0.0" newVersion="3.5.0.0"/>
            </dependentAssembly>
        </assemblyBinding>
    </runtime>


</configuration>

Web.sitemap is as follows:

Code:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
    <siteMapNode url="~/" title="Home" description="Home">
        <siteMapNode url="~/Default.aspx" title="Home" description="Go to the homepage" />
        <siteMapNode url="~/Folder1/Default.aspx" title="Folder1" description="Folder1">
            <siteMapNode url="~/Folder1/page1.aspx" title="page1" description="page1 of folder1" />
            <siteMapNode url="~/Folder1/page2.aspx" title="page2" description="page2 of Folder1" />           
        </siteMapNode>        
    </siteMapNode>
</siteMap>

When the mouse hovers over Dynamic Menu Items (but not clicked on Dynamic Menu Item) and after that when mouse hovers over plain part of web site, footer jumps above "MainContent"....

But, when page is refreshed, the footer sets to bottom again...

Would you please say me what is making the footer jump and how to correct this code so as to keep footer frozen at bottom always...

Thanking You in Advance...

Imar · October 17th, 2009, 04:17 AM

Hi there,

I am not seeing the behavior you're describing. I see a dark menu with a bread crumb below it. The footer was empty, but as soon as I add some text to it I can see it but it stays where it was....

Cheers,

Imar

varunbwj · October 17th, 2009, 09:33 AM

Hi Imar...

But i see the footer all the time (either text on it or not)... If there was any way to show u the prob, i could have communicated the problem better...

Hmm... Ok , then i ll try to run this code in some other computer and see...

What i observed was when i removed the footer all together and placed some text instead, below the Sidebar division:

Code:

<div id="Sidebar"></div>

it kept its place for ever in the bottom...

As the jumping footer kept irritating me, i removed footer from the website...
In the place of

Code:

<div id="Footer"></div>

i placed the following code :

Code:

<div>
<span class="BackImage"> .......................................................</span>
</div>

As "." is text, it stays at the bottom, and background is given to this text

where BackImage in Style sheet is :

Code:

.BackImage
{
    background-image: url('Images/footer.jpg');
    color: #FFFFFF;
}

As of now i am letting website have an appearance of footer rather than the true footer...

Thanks for spending your precious time in considering the problem and helping me...

Thanks a lot...

Imar · October 17th, 2009, 09:38 AM

You could try adding clear: both to the Footer in the CSS file:

#Footer
{
... other stuff here
clear: both;
}

This forces the Footer to move to its own line....

Imar

varunbwj · October 18th, 2009, 01:19 AM

Hi...

clear : both;

is there in the #Footer.... I have sent the code to u (Entire FooterProb Website code above)... Its above in this forum... Somehow, its not keeping footer at the bottom in my system...

I executed the website code in my frnds computer... Its not showing any problem there.. I am not getting why its jumping in my system...

And also, In my PC, when i save the e-page which is opened by the "Browse with" option of VWD as "Default.aspx.mht" and then open this saved page, there is no problem... So, i hope, when the website is hosted, there ll b no prob..

Thanks Imar...
Thanks for your guidance and help...

Imar · October 18th, 2009, 02:43 AM

You're welcome.

It's a bit difficult to fix a problem that I cannot reproduce locally, so unless you have an on-line version that shows the problem, I am afraid I cannot do much else......

Maybe you are using a different browser than then the one your friend is using?

Cheers,

Imar

varunbwj · October 19th, 2009, 11:23 AM

Hi Imar...

Thanks...
But, i am not getting how to show u the problem online as this website is not hosted...

And, its the same browser which my friend is using probly it might be of different version... i did not check...

Hmm... If in any ways i can send you a video file which shows the footer jump problem, then i think communication will b clear... Or, is there any way to show you the website prob online without hosting it?

Thanks a lot Imar...
Thanks...