Custom Header/Footer Controls

cyclonebri

Regular
Joined
Jul 30, 2003
Messages
93
Location
Ames, IA, USA
Hi All,

I'm having some issues and I wondered if anyone else has had this problem before and if so, how to solve it.

Basically, I need to make a header and footer that contain some information that will go across all of my aspx pages for this system. The problem is that the only way I've found to include a header and footer is using user controls. Creating the controls and adding them to the page is also not a problem, but there are two problems with doing things this way which I need help solving.

First of all, creating a custom user control 'pads' the table that I have within the control, so that when I add it to the page there is a whitespace border around it, which I do not want (I need it flush to the top left and 100% with flush to the right. Because the user control is flow layout and cannot be changed, I cannot move the table within the design view to be flush on the top and left as I need to. IF I could do this, it would work fine, but the IDE won't let me change to grid layout for a user control, and putting a panel or other control in still remains padded with that same border.

The second problem is that on resize of the control (even in an embedded table to hold the control), the control changes size and the rest of the page overlaps it, rather than the rest of the page being rendered following the bottom of the header or top of the footer. This is completely unacceptable :)!

If anyone has advice on how to beat either of these problems, I would sure appreciate it. Furthermore, this must be rendered in 1.1, so using 2.0 is not an option.

Thanks,
Brian
 
Here is a solution to the way that I handle the same situation.

I use a CSS Style Sheet for the styles with the following values added:
Code:
/*****************************************************
Table for page header
*****************************************************/
.pageHeaderTable
{
position:absolute;
top:0px;
left:0px;
width:100%;
}
/*****************************************************
Root table for page
*****************************************************/
.pageRootTable
{
position: relative;
top:50px;
left:0px;
width:100%;
}
/*****************************************************
Table for page footer
*****************************************************/
.pageFooterTable
{
height: 15px;
width: 100%;[size=2]
[/size]}

For the Header.ascx file my layout is as follows:
Code:
<asp:Table ID="tblHeader" Runat="server" CssClass="pageHeaderTable" CellPadding="0" CellSpacing="0">
	.
	.
	.
</asp:Table>

For the Footer.ascx file my layout is as follows:
Code:
<asp:Table ID="tblFooter" Runat="server" CssClass="pageFooterTable" CellPadding="0" CellSpacing="0">
	.
	.
	.
</asp:Table>

And for the *.aspx files my layout is as follows:
Code:
<body topmargin="0px" leftmargin="0px">
<form id="Form1" method="post" runat="server">
	<%-- Begin Page Header --%>
	<asp:Table ID="tblHeaderContainer" Runat="server" CssClass="pageHeaderTable" Width="100%" CellPadding="0" CellSpacing="0">
	 <asp:TableRow Width="100%">
		<asp:TableCell Width="100%">
		 <uc:header ID="ucHeader" runat="server"></uc:header>
		</asp:TableCell>
	 </asp:TableRow>
	</asp:Table>
	<%-- End Page Header --%>
	<asp:table id="tblMain" Runat="server" CssClass="pageRootTable" CellPadding="0" CellSpacing="0" Width="100%">
	.
	.
	.
	</asp:Table>
	<%-- Begin Page Footer --%>
	<asp:Table ID="tblFooterContainer" Runat="server" CssClass="pageFooterTable" Width="100%" CellPadding="0" CellSpacing="0">
	 <asp:TableRow>
		<asp:TableCell>
		 <uc:footer ID="ucFooter" runat="server"></uc:footer>
		</asp:TableCell>
	 </asp:TableRow>
	</asp:Table>
<%-- End Page Footer --%>
</form>
</body>

If your not using style sheets, then you could just include style attributes for the tags with the information that I provided.

Hope this helps.
 
Jeff,

I just wanted to say thank you. What you suggested works very well, and I am now able to implement the header and footer as requested. Thank you very much for pointing this method out! I much appreciate it!

Take Care,
Brian
 
Back
Top