Wed, 2012-02-15 07:44
As stated in title, I've been having problems getting my input textboxes to line up vertically while having the form in the center of the parent element.
Here is my code:
HTML:
<div id="form"> <form id="Form1" runat="server" onsubmit="return formValidate()"> <div id="namePos"> <p>First name: <asp:TextBox ID="inputFirstName" runat="server" /></p> <p>Last name: <asp:TextBox ID="inputLastName" runat="server" /></p> <div id="nameErr" class="errM"></div> </div> <div id="emailPos"> <p>E-mail: <asp:TextBox ID="inputEmail" runat="server" /></p> <div id="emailErr" class="errM"></div> </div> <div id="iNumPos"> <p>INumber: <asp:TextBox ID="inputINumber" runat="server" /></p> <div id="iNumErr" class="errM"></div> </div> <div id="managerIDPos"> <p>Manager ID: <asp:TextBox ID="inputManagerID" runat="server" /></p> <div id="managerIDErr" class="errM"></div> </div> <div id="modelIDPos"> <p>User ID: <asp:TextBox ID="inputModelID" runat="server" ToolTip="optional but recommended" /></p> <div id="modelIDErr" class="errM"></div> </div> <div id="datePos"> <p>Start date (MM/DD/YYYY): <asp:TextBox ID="inputStartDate" runat="server" /></p> <p>End date (MM/DD/YYYY): <asp:TextBox ID="inputEndDate" runat="server" /></p> <div id="dateErr" class="errM"></div> </div> </div> <p class="textcenter"><asp:Button ID="btnSubmit" runat="server" OnClick="btnSubmit_Click" Text="Submit" /></p> </form>
CSS:
#form { } .textcenter {text-align: center;} div.error{ display: block !important; border: 1px solid #F9B9B2; background-color: #FFDFDF; } .errM{ color:red; font-size: small; }
The .errM and .error classes are activated using javascript upon receiving bad input. The block is supposed to all turn pinkish. When I do something like text-align: right; padding-right: 150px;, the form looks fairly centered but the pink background stops at the 150px of the padding.
Unfortunately I do not have a live page to show the issue.
Wed, 2012-02-15 10:36
#1
send us the full code. or
send us the full code. or else upload some server and give it me some link:
Wed, 2012-02-15 15:48
#2
This is the full code. There
This is the full code. There is just an extra centered div in the Master Page file that holds all of this
Div:
<center> <div id="template"> <!--form here--> </div> </center>
CSS for outer div:
template{ border:2px #666 solid; }
Tue, 2012-02-21 06:30
#3
anyone?
anyone?