HTML Form Align - html

Question

I'm struggling to get the content of my div to align, everything will center apart from the contents of the table. The title will center along with the login button.
CSS:
.center {
margin:auto;
width: 50%;
border:3px solid #8AC007;
padding: 10px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
font-family:'Century Gothic';
text-align:center;
}
HTML:
<div class="center">
<form id="form1" runat="server">
<h3>
Login Page</h3>
<table >
<tr>
<td>
E-mail address:</td>
<td>
<asp:TextBox ID="UserEmail" runat="server" /></td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1"
ControlToValidate="UserEmail"
Display="Dynamic"
ErrorMessage="Required"
runat="server" />
</td>
</tr>
<tr>
<td>
Password:</td>
<td>
<asp:TextBox ID="UserPass" TextMode="Password"
runat="server" />
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2"
ControlToValidate="UserPass"
ErrorMessage="Cannot be empty."
runat="server" />
</td>
</tr>
<tr>
<td>
Remember me?</td>
<td>
<asp:CheckBox ID="Persist" runat="server" /></td>
</tr>
</table>
<asp:Button ID="Submit1" OnClick="Logon_Click" Text="Login"
runat="server" />
<p>
<asp:Label ID="Msg" ForeColor="red" runat="server" />
</p>
</form>
</div>
I've tried text align on the table as well with no luck

Answer 1

Apply margin: 0 auto to the table element. Currently your margin: auto only centers the form but inside it the table is aligned to the left because of the default behavior of contents to start from left.
Don't try to use tables for layout purpose, although you can use them for tabular data.
.center {
margin: auto;
width: 50%;
border: 3px solid #8AC007;
padding: 10px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
font-family: 'Century Gothic';
text-align: center;
}
table {
margin: 0 auto; /* Add */
}
<div class="center">
<form id="form1" runat="server">
<h3>
Login Page</h3>
<table>
<tr>
<td>
E-mail address:</td>
<td>
<asp:TextBox ID="UserEmail" runat="server" />
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="UserEmail" Display="Dynamic" ErrorMessage="Required" runat="server" />
</td>
</tr>
<tr>
<td>
Password:</td>
<td>
<asp:TextBox ID="UserPass" TextMode="Password" runat="server" />
</td>
<td>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" ControlToValidate="UserPass" ErrorMessage="Cannot be empty." runat="server" />
</td>
</tr>
<tr>
<td>
Remember me?</td>
<td>
<asp:CheckBox ID="Persist" runat="server" />
</td>
</tr>
</table>
<asp:Button ID="Submit1" OnClick="Logon_Click" Text="Login" runat="server" />
<p>
<asp:Label ID="Msg" ForeColor="red" runat="server" />
</p>
</form>
</div>