*.ascx controls - header and footer alignment question

I've made 2 controls - header/footer.

I can drag the header just fine.

The problem is the footer. When I drag and drop it onto my form it drops to the right of my header control and is never displayed.

Why is this and does anyone have a solution to this annoying 'feature'?

Re: *.ascx controls - header and footer alignment question

I would hazard a guess that its something to do with the design of your page. Can you post some code or samples?

1 Attachment(s)

Re: *.ascx controls - header and footer alignment question

Okay, below is the code to the page...
It originally did not have the myFooter control - I just dragged it and tried to drop it near the bottom of the page and it 'snapped' to the rightside of the myHeader control.

Studio added the line at the end right above the closing form tag.

I've also attached an image so you can see them at the top of the page.

Code:

<%@ Page language="c#" Codebehind="registration.aspx.cs" AutoEventWireup="false" Inherits="Rosary.registration" %> <%@ Register TagPrefix="uc1" TagName="myFooter" Src="controls/myFooter.ascx" %> <%@ Register TagPrefix="uc1" TagName="myHeader" Src="controls/myHeader.ascx" %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > <HTML> <HEAD> <title>registration</title> <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1"> <meta name="CODE_LANGUAGE" Content="C#"> <meta name="vs_defaultClientScript" content="JavaScript"> <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5"> <LINK href="Style/iestyle.css" type="text/css" rel="stylesheet"> </HEAD> <body MS_POSITIONING="GridLayout"> <form id="Form1" method="post" runat="server"> <uc1:myHeader id="MyHeader1" runat="server"></uc1:myHeader> <asp:Label id="Label1" style="Z-INDEX: 101; LEFT: 23px; POSITION: absolute; TOP: 86px" runat="server">Fill in the fields below to register as a Crystal Rosary member:</asp:Label> <asp:Label id="Label2" style="Z-INDEX: 102; LEFT: 24px; POSITION: absolute; TOP: 165px" runat="server" CssClass="Label">First Name:</asp:Label> <asp:Label id="Label3" style="Z-INDEX: 103; LEFT: 24px; POSITION: absolute; TOP: 200px" runat="server" CssClass="Label">Last Name:</asp:Label> <asp:Label id="Label4" style="Z-INDEX: 104; LEFT: 24px; POSITION: absolute; TOP: 235px" runat="server" CssClass="Label">Address1:</asp:Label> <asp:Label id="Label5" style="Z-INDEX: 105; LEFT: 24px; POSITION: absolute; TOP: 270px" runat="server" CssClass="Label">Address2:</asp:Label> <asp:Label id="Label6" style="Z-INDEX: 106; LEFT: 24px; POSITION: absolute; TOP: 305px" runat="server" CssClass="Label">City:</asp:Label> <asp:Label id="Label7" style="Z-INDEX: 107; LEFT: 24px; POSITION: absolute; TOP: 340px" runat="server" CssClass="Label">State:</asp:Label> <asp:Label id="Label8" style="Z-INDEX: 108; LEFT: 24px; POSITION: absolute; TOP: 375px" runat="server" CssClass="Label">Zip Code:</asp:Label> <asp:Label id="Label9" style="Z-INDEX: 109; LEFT: 24px; POSITION: absolute; TOP: 410px" runat="server" CssClass="Label">Phone Number:</asp:Label> <asp:Label id="Label10" style="Z-INDEX: 110; LEFT: 24px; POSITION: absolute; TOP: 445px" runat="server" CssClass="Label">Mobile Phone:</asp:Label> <asp:Label id="Label11" style="Z-INDEX: 111; LEFT: 24px; POSITION: absolute; TOP: 480px" runat="server" CssClass="Label">E-mail:</asp:Label> <asp:Label id="Label12" style="Z-INDEX: 112; LEFT: 24px; POSITION: absolute; TOP: 521px" runat="server" CssClass="Label">BirthDate:</asp:Label> <asp:TextBox id="txtFirstName" style="Z-INDEX: 113; LEFT: 156px; POSITION: absolute; TOP: 165px" runat="server"></asp:TextBox> <asp:TextBox id="txtLastName" style="Z-INDEX: 114; LEFT: 156px; POSITION: absolute; TOP: 200px" runat="server"></asp:TextBox> <asp:TextBox id="txtAddress1" style="Z-INDEX: 115; LEFT: 156px; POSITION: absolute; TOP: 235px" runat="server"></asp:TextBox> <asp:TextBox id="txtAddress2" style="Z-INDEX: 116; LEFT: 156px; POSITION: absolute; TOP: 270px" runat="server"></asp:TextBox> <asp:TextBox id="txtCity" style="Z-INDEX: 117; LEFT: 156px; POSITION: absolute; TOP: 305px" runat="server"></asp:TextBox> <asp:TextBox id="txtState" style="Z-INDEX: 118; LEFT: 156px; POSITION: absolute; TOP: 340px" runat="server"></asp:TextBox> <asp:TextBox id="txtZipCode" style="Z-INDEX: 119; LEFT: 156px; POSITION: absolute; TOP: 375px" runat="server"></asp:TextBox> <asp:TextBox id="txtPhoneNumber" style="Z-INDEX: 120; LEFT: 156px; POSITION: absolute; TOP: 410px" runat="server"></asp:TextBox> <asp:TextBox id="txtMobileNumber" style="Z-INDEX: 121; LEFT: 156px; POSITION: absolute; TOP: 445px" runat="server"></asp:TextBox> <asp:TextBox id="txtEmail" style="Z-INDEX: 122; LEFT: 156px; POSITION: absolute; TOP: 480px" runat="server"></asp:TextBox> <asp:TextBox id="txtBirthdate" style="Z-INDEX: 123; LEFT: 156px; POSITION: absolute; TOP: 521px" runat="server"></asp:TextBox> <asp:Button id="btnAccept" style="Z-INDEX: 124; LEFT: 467px; POSITION: absolute; TOP: 164px" runat="server" Text="Register" Width="99px"></asp:Button> <asp:RequiredFieldValidator id="RequiredFieldValidator1" style="Z-INDEX: 125; LEFT: 319px; POSITION: absolute; TOP: 169px" runat="server" ErrorMessage="Missing Name" ControlToValidate="txtFirstName" Display="Dynamic" CssClass="Label"></asp:RequiredFieldValidator> <asp:RequiredFieldValidator id="RequiredFieldValidator2" style="Z-INDEX: 126; LEFT: 319px; POSITION: absolute; TOP: 204px" runat="server" ErrorMessage="Missing Name" ControlToValidate="txtLastName" Display="Dynamic" CssClass="Label"></asp:RequiredFieldValidator> <asp:RegularExpressionValidator id="RegularExpressionValidator1" style="Z-INDEX: 127; LEFT: 319px; POSITION: absolute; TOP: 484px" runat="server" ErrorMessage="Invalid Email Address" ControlToValidate="txtEmail" ValidationExpression="\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" Display="Dynamic" CssClass="Label"></asp:RegularExpressionValidator> <asp:RequiredFieldValidator id="RequiredFieldValidator3" style="Z-INDEX: 128; LEFT: 319px; POSITION: absolute; TOP: 309px" runat="server" ErrorMessage="Missing City" ControlToValidate="txtCity" Display="Dynamic" CssClass="Label"></asp:RequiredFieldValidator> <asp:RequiredFieldValidator id="RequiredFieldValidator4" style="Z-INDEX: 129; LEFT: 319px; POSITION: absolute; TOP: 344px" runat="server" ErrorMessage="Missing State" ControlToValidate="txtState" Display="Dynamic" CssClass="Label"></asp:RequiredFieldValidator> <asp:Button id="Button1" style="Z-INDEX: 130; LEFT: 467px; POSITION: absolute; TOP: 210px" runat="server" Text="Cancel" Width="96px"></asp:Button> <asp:Button id="Button2" style="Z-INDEX: 131; LEFT: 470px; POSITION: absolute; TOP: 268px" runat="server" Text="Send Mail"></asp:Button> <asp:Label id="Label13" style="Z-INDEX: 132; LEFT: 23px; POSITION: absolute; TOP: 114px" runat="server" Width="413px" CssClass="Label">You will be the first to receive information about our new products even before we list them on our site.</asp:Label> <uc1:myFooter id="MyFooter1" runat="server"></uc1:myFooter> </form> </body> </HTML>

Re: *.ascx controls - header and footer alignment question

That's what you're going to get if you use absolute positioning on your pages. You should switch to the flow layout for the page, and use tables for aligning all your labels and form elements.