• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 891
  • Last Modified:

Header and footer in .Aspx page

hello everyone ....

iam trying to re-create the following html page  http://www.ltdmanagement.com/job_openings.htm  as an aspx page with out using frame sets as this html page has been done using frame sets . I have to maintain the header and footer as the same but in b/w the two i wish to add some web contorls like datagrid , listboxes etc ..I need the footer.aspx or .html  to be at the bottom of the screen as dispalyed in the link given ..not move up and down the screen according to the width of the middle portion which will be populated depending on certain criteria .  I would like to use a different background colour for the middle protion of the screen as in the web site ...... I would like to know if this is possible.  I was able to include the footer in the aspx page but it moves accroding to the height of the data displayed in the middle.

Hoping for a reply ASAP

thanks in advance

ashwin
0
Ashwin_shastry
Asked:
Ashwin_shastry
2 Solutions
 
muzzy2003Commented:
You could use a DIV for the middle with overflow style set to allow scrollbars. How cross-browser do you need it to be?
0
 
Ashwin_shastryAuthor Commented:
could u plz send me a sample code ...that would be really helpful


thanks in advance
ashwin
0
 
muzzy2003Commented:
Off the top of my head, something like:

<div style="height:200px;width:400px;overflow-y:auto;">

Your HTML

</div>
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
Ashwin_shastryAuthor Commented:
Iam still having problems ....i woulldnt mind increasing the points ....

this is what iam doing .....

<HTML>
      <HEAD>
            <title>WebForm5</title>
            <meta content="Microsoft Visual Studio 7.0" name="GENERATOR">
            <meta content="C#" name="CODE_LANGUAGE">
            <meta content="JavaScript" name="vs_defaultClientScript">
            <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
      </HEAD>
      <BODY text="#000000" vLink="#990099" aLink="#ff0000" link="#0000ff" bgColor="#ffffff" leftMargin="0" background="outside background" topMargin="0" MS_POSITIONING="GridLayout">
            <form id="WebForm5" method="post" runat="server">
                  <TABLE id="Table1" cellSpacing="0" cellPadding="0" width="100%" background="middle background" runat="server">
                        <TBODY>
                              <TR vAlign="baseline" bgColor="black">
                                    <TD vAlign="baseline" width="100%">
                                          <TABLE cellSpacing="0" cellPadding="0" align="center" border="0">
                                                <TR>
                                                      <TD style="HEIGHT: 70px" rowSpan="2"><A href="http://www.ltdmanagement.com/index.htm" target="_parent"><IMG height="74" alt="LTD Management Co., Inc." src="Images/inner_ltd_logo.gif" width="348" border="0"></A></TD>
                                                      <TD align="middle"><A href="http://www.ltdmanagement.com/profile1.htm" target="main"><IMG height="38" alt="About Us" src="Images/btn_aboutus.gif" width="102" border="0"></A><A href="http://www.ltdmanagement.com/portfolio1.htm" target="main"><IMG height="38" alt="Our Hotels" src="Images/btn_ourhotels.gif" width="117" border="0"></A><A href="http://www.ltdmanagement.com/news_selection.htm" target="main"><IMG height="38" alt="News" src="Images/btn_news.gif" width="61" border="0"></A></TD>
                                                </TR>
                                                <TR>
                                                      <TD style="HEIGHT: 32px" align="middle"><A href="http://www.ltdmanagement.com/job_openings1.htm" target="main"><IMG height="36" alt="Job Openings" src="Images/btn_jobopenings.gif" width="126" border="0"></A><A href="http://www.ltdmanagement.com/contact1.htm" target="main"><IMG height="36" alt="Feedback" src="Images/btn_feedback.gif" width="93" border="0"></A></TD>
                                                </TR>
                                          </TABLE>
                                    </TD>
                              </TR>
                        </TBODY>
                  </TABLE>
                  <asp:TextBox id="TextBox1" style="Z-INDEX: 101; LEFT: 112px; POSITION: absolute; TOP: 147px" runat="server"></asp:TextBox>
                  <asp:ListBox id="ListBox1" style="Z-INDEX: 102; LEFT: 147px; POSITION: absolute; TOP: 254px" runat="server"></asp:ListBox>
                  <asp:Button id="Button1" style="Z-INDEX: 103; LEFT: 157px; POSITION: absolute; TOP: 389px" runat="server" Text="Button"></asp:Button>
            </form>
      </BODY>
</HTML>



this creates a  table with the image the same as i had mentioned in the web site  at the top ..... now i add to the aspx page  a texbox , list box and a button for example ..... now i need to display the image in bottom as shown in the web site ..... and should not change its position if the data in the middle is reduced ......how do i go abt putting the footer aspx file (assuming the i have footer.aspx which has the images displayed at the bottom as shown in the URL ) even when i add <!--#include File = "footer.aspx"--> in the above code ...it comes right after the  aspx button .....i want it at the bottom as shown in the http://www.ltdmanagement.com/job_openings.htm  URL ....

hope u can help me
ashwin
hope u can help me
0
 
jk_vrCommented:
Please try this. I have just pasted the header table as footer also.

<HTML>
      <HEAD>
            <title>WebForm5</title>
            <meta content="Microsoft Visual Studio 7.0" name="GENERATOR">
            <meta content="C#" name="CODE_LANGUAGE">
            <meta content="JavaScript" name="vs_defaultClientScript">
            <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
      </HEAD>
      <BODY text="#000000" vLink="#990099" aLink="#ff0000" link="#0000ff" bgColor="#ffffff"
            leftMargin="0" background="outside background" topMargin="0" MS_POSITIONING="GridLayout">
            <form id="WebForm5" method="post" runat="server">
                  <TABLE id="Table1" cellSpacing="0" cellPadding="0" width="100%" background="middle background"
                        runat="server">
                        <TBODY>
                              <TR vAlign="baseline" bgColor="black">
                                    <TD vAlign="baseline" width="100%">
                                          <TABLE cellSpacing="0" cellPadding="0" align="center" border="0">
                                                <TR>
                                                      <TD style="HEIGHT: 70px" rowSpan="2"><A href="http://www.ltdmanagement.com/index.htm" target="_parent"><IMG height="74" alt="LTD Management Co., Inc." src="Images/inner_ltd_logo.gif" width="348"
                                                                        border="0"></A></TD>
                                                      <TD align="center"><A href="http://www.ltdmanagement.com/profile1.htm" target="main"><IMG height="38" alt="About Us" src="Images/btn_aboutus.gif" width="102" border="0"></A><A href="http://www.ltdmanagement.com/portfolio1.htm" target="main"><IMG height="38" alt="Our Hotels" src="Images/btn_ourhotels.gif" width="117" border="0"></A><A href="http://www.ltdmanagement.com/news_selection.htm" target="main"><IMG height="38" alt="News" src="Images/btn_news.gif" width="61" border="0"></A></TD>
                                                </TR>
                                                <TR>
                                                      <TD style="HEIGHT: 32px" align="center"><A href="http://www.ltdmanagement.com/job_openings1.htm" target="main"><IMG height="36" alt="Job Openings" src="Images/btn_jobopenings.gif" width="126" border="0"></A><A href="http://www.ltdmanagement.com/contact1.htm" target="main"><IMG height="36" alt="Feedback" src="Images/btn_feedback.gif" width="93" border="0"></A></TD>
                                                </TR>
                                          </TABLE>
                                    </TD>
                              </TR>
                        </TBODY>
                  </TABLE>
                  <div style="OVERFLOW:auto;HEIGHT:400px">
                        <asp:TextBox id="TextBox1" style="Z-INDEX: 101; LEFT: 112px; POSITION: absolute; TOP: 147px"
                              runat="server"></asp:TextBox>
                        <asp:ListBox id="ListBox1" style="Z-INDEX: 102; LEFT: 147px; POSITION: absolute; TOP: 254px"
                              runat="server"></asp:ListBox>
                        <asp:Button id="Button1" style="Z-INDEX: 103; LEFT: 157px; POSITION: absolute; TOP: 389px" runat="server"
                              Text="Button"></asp:Button>
                  </div>
                  <TABLE id="Table2" cellSpacing="0" cellPadding="0" width="100%" background="middle background"
                        runat="server">
                        <TBODY>
                              <TR vAlign="baseline" bgColor="black">
                                    <TD vAlign="baseline" width="100%">
                                          <TABLE cellSpacing="0" cellPadding="0" align="center" border="0">
                                                <TR>
                                                      <TD style="HEIGHT: 70px" rowSpan="2"><A href="http://www.ltdmanagement.com/index.htm" target="_parent"><IMG height="74" alt="LTD Management Co., Inc." src="Images/inner_ltd_logo.gif" width="348"
                                                                        border="0"></A></TD>
                                                      <TD align="center"><A href="http://www.ltdmanagement.com/profile1.htm" target="main"><IMG height="38" alt="About Us" src="Images/btn_aboutus.gif" width="102" border="0"></A><A href="http://www.ltdmanagement.com/portfolio1.htm" target="main"><IMG height="38" alt="Our Hotels" src="Images/btn_ourhotels.gif" width="117" border="0"></A><A href="http://www.ltdmanagement.com/news_selection.htm" target="main"><IMG height="38" alt="News" src="Images/btn_news.gif" width="61" border="0"></A></TD>
                                                </TR>
                                                <TR>
                                                      <TD style="HEIGHT: 32px" align="center"><A href="http://www.ltdmanagement.com/job_openings1.htm" target="main"><IMG height="36" alt="Job Openings" src="Images/btn_jobopenings.gif" width="126" border="0"></A><A href="http://www.ltdmanagement.com/contact1.htm" target="main"><IMG height="36" alt="Feedback" src="Images/btn_feedback.gif" width="93" border="0"></A></TD>
                                                </TR>
                                          </TABLE>
                                    </TD>
                              </TR>
                        </TBODY>
                  </TABLE>
            </form>
      </BODY>
</HTML>
0
 
Snarf0001Commented:
Though I realize most current web developers will tell you to NEVER use tables for layout, I still do in cases like this, as the % attribute for width and height is invaluable.
The following code does what you need.  The header and footer are always at the top and bottom of the screen (no matter what the screen size is, or whether or not the user sizes the window), and the main content (or center cell) will have scrollbars if needed.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
      <HEAD>
            <title>Sample</title>
            <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
            <style> #Content { position:relative; background-color: #444444; overflow:auto; height:100%;  }
            </style>
      </HEAD>
      <body bottomMargin="0" leftMargin="0" topMargin="0" rightMargin="0">
            <form name="Form1" method="post" action="default.aspx" id="Form1">
                  <table height="100%" cellSpacing="0" cellPadding="0" width="100%" border="0">
                        <tr>
                              <td>
                                    Header
                              </td>
                        </tr>
                        <tr>
                              <td vAlign="top" width="100%" height="100%">
                                    <div id="Content">
                                          <!--
                                          <table height="1200">
                                                <tr>
                                                      <td>table</td>
                                                </tr>
                                          </table>
                                          -->
                                    </div>
                              </td>
                        </tr>
                        <tr>
                              <td>
                                    Footer
                              </td>
                        </tr>
                  </table>
            </form>
      </body>
</HTML>
0
 
Ashwin_shastryAuthor Commented:
hi  jk_vr and  Snarf0001

thanks a lot for ur replies ...i was able to combine ur answers to get what i want .... i have pasted the code here ......  I think u both can share the points ...thanks a lot once again

cheers
Ashwin


<%@ Page language="c#" Codebehind="test.aspx.cs" AutoEventWireup="false" Inherits="LTD.test" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
      <HEAD>
            <title>test</title>
            <meta name="GENERATOR" Content="Microsoft Visual Studio 7.0">
            <meta name="CODE_LANGUAGE" Content="C#">
            <meta name="vs_defaultClientScript" content="JavaScript">
            <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
      </HEAD>
      <body bottomMargin="0" leftMargin="0" topMargin="0" rightMargin="0" MS_POSITIONING="GridLayout">
            <form id="test" runat="server" name="Form1" method="post">
                  <table height="100%" cellSpacing="0" cellPadding="0" width="100%" border="0">
                        <TBODY>
                              <tr>
                                    <td>
                                          <TABLE id="Table1" cellSpacing="0" cellPadding="0" width="100%" background="middle background" runat="server" height="93">
                                                <TBODY>
                                                      <TR vAlign="baseline" bgColor="black">
                                                            <TD vAlign="baseline" width="100%">
                                                                  <TABLE cellSpacing="0" cellPadding="0" align="center" border="0">
                                                                        <TR>
                                                                              <TD style="HEIGHT: 70px" rowSpan="2"><A href="http://www.ltdmanagement.com/index.htm" target="_parent"><IMG height="74" alt="LTD Management Co., Inc." src="Images/inner_ltd_logo.gif" width="348" border="0"></A></TD>
                                                                              <TD align="middle"><A href="http://www.ltdmanagement.com/profile1.htm" target="main"><IMG height="38" alt="About Us" src="Images/btn_aboutus.gif" width="102" border="0"></A><A href="http://www.ltdmanagement.com/portfolio1.htm" target="main"><IMG height="38" alt="Our Hotels" src="Images/btn_ourhotels.gif" width="117" border="0"></A><A href="http://www.ltdmanagement.com/news_selection.htm" target="main"><IMG height="38" alt="News" src="Images/btn_news.gif" width="61" border="0"></A></TD>
                                                                        </TR>
                                                                        <TR>
                                                                              <TD style="HEIGHT: 32px" align="middle"><A href="http://www.ltdmanagement.com/job_openings1.htm" target="main"><IMG height="36" alt="Job Openings" src="Images/btn_jobopenings.gif" width="126" border="0"></A><A href="http://www.ltdmanagement.com/contact1.htm" target="main"><IMG height="36" alt="Feedback" src="Images/btn_feedback.gif" width="93" border="0"></A></TD>
                                                                        </TR>
                                                                  </TABLE>
                                                            </TD>
                                                      </TR>
                                                </TBODY>
                                          </TABLE>
                                    </td>
                              </tr>
                              <TR>
                                    <td vAlign="top" width="100%" height="100%">
                                          <DIV style="OVERFLOW: auto;WIDTH: 100%;HEIGHT: 100%">
                                                <P>
                                                      <asp:Button id="Button1" runat="server" Text="Button"></asp:Button></P>
                                                <P>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                                </P>
                                                <P>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                                </P>
                                                <P>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                                </P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                                      <asp:Button id="Button3" runat="server" Text="Button"></asp:Button></P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;</P>
                                                <P>&nbsp;</P>
                                                <P>
                                                      <asp:Button id="Button4" runat="server" Text="Button"></asp:Button></P>
                                          </DIV>
                                    </td>
                              </TR>
                              <TR vAlign="baseline" bgColor="black">
                                    <TD vAlign="baseline" width="100%">
                                          <TABLE cellSpacing="0" cellPadding="0" align="center" border="0">
                                                <TR>
                                                      <TD style="HEIGHT: 70px" rowSpan="2"><A href="http://www.ltdmanagement.com/index.htm" target="_parent"><IMG height="74" alt="LTD Management Co., Inc." src="Images/inner_ltd_logo.gif" width="348" border="0"></A></TD>
                                                      <TD align="middle"><A href="http://www.ltdmanagement.com/profile1.htm" target="main"><IMG height="38" alt="About Us" src="Images/btn_aboutus.gif" width="102" border="0"></A><A href="http://www.ltdmanagement.com/portfolio1.htm" target="main"><IMG height="38" alt="Our Hotels" src="Images/btn_ourhotels.gif" width="117" border="0"></A><A href="http://www.ltdmanagement.com/news_selection.htm" target="main"><IMG height="38" alt="News" src="Images/btn_news.gif" width="61" border="0"></A></TD>
                                                </TR>
                                                <TR>
                                                      <TD style="HEIGHT: 32px" align="middle"><A href="http://www.ltdmanagement.com/job_openings1.htm" target="main"><IMG height="36" alt="Job Openings" src="Images/btn_jobopenings.gif" width="126" border="0"></A><A href="http://www.ltdmanagement.com/contact1.htm" target="main"><IMG height="36" alt="Feedback" src="Images/btn_feedback.gif" width="93" border="0"></A></TD>
                                                </TR>
                                          </TABLE>
                                    </TD>
                              </TR>
                        </TBODY>
                  </table>
                  </TD></TR></TBODY></TABLE>
            </form>
      </body>
</HTML>
0

Featured Post

Get expert help—faster!

Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now