无法对齐某些文本字段答案

【问题标题】：unable to align some of the text-fields无法对齐某些文本字段
【发布时间】：2012-03-24 17:55:23
【问题描述】：

这是我发布的镜头设计：

<div id=site_content>
<div id = left_content>
<table>
                            <tr>
                                <td> <h1> First Name </h1> </td>
                                <td> <input type="text" name="FirstName" /> </td>
                            </tr>
                            <tr>
                                <td> <h1> Last Name </h1> </td>
                                <td> <input type="text" name="LastName"/> </td>
                            </tr>
                            <tr>
                                <td> <h1> Email </h1></td>
                                <td> <input type="email" name="Email"/> </td>
                            </tr>
                            <tr>
                                <td> <h1> Password </h1> </td>
                                <td> <input type="password" name="Password"/> </td>
                            </tr>
                            <tr>
                                <td> <h1> Retype Password </h1> </td>
                                <td> <input type="password" name="RetypedPassword"/> </td>
                            </tr>
                            <tr>
                            <td colspan="2"> <center> <input type="submit" value="submit" /> </center> </td>
                            </tr>
                        </table>
      </div></div>

虽然我试图对齐它们，但做得不够。如果您注意到 Retype Password 字段未正确对齐。如果我们仔细注意到，其他人也不是。我怎样才能使它们对齐，我是一种常规方式。

CSS：

h1, h2, h3, h4, h5, h6 { 
  font: normal 200% 'Yanone Kaffeesatz', arial, sans-serif;
  margin: 0 0 15px 0;
  padding: 0 0 5px 0;}

#site_content { 
 width: 950px;
 overflow: hidden;
 margin: 4px auto 0 auto;
 padding: 0;}

#left_content { 
 float: left;
 text-align: justify;
 width: 444px;
 padding: 20px 0 5px 25px;
 margin: 0;}

【问题讨论】：

请贴出相应的CSS。这就是（最有可能的）问题所在。
<td align="(left|center|right)"> ?或者如果你的意思是垂直对齐<td valign="(top|middle|bottom)">
亲爱的，看看我的回答，如果我落后于某个地方，请告诉我......

标签： html css forms alignment

【解决方案1】：

您正在为 h1 元素设置 15 像素的下边距。改为将其设置为零。更好的是，在这里删除语义上所有错误的 h1 标记（它们是字段标签，而不是一级标题），改用 label 并且根本不设置它们的边距。

特别是如果您为标签使用非常大 (200%) 的字体大小，请在最长标签和输入字段之间设置一些额外的间距。使用label，您可以为其设置一些正确的填充。

【讨论】：

【解决方案2】：

查看小提琴的输出/代码和演示

小提琴：http://jsfiddle.net/uDL8K/

演示：http://jsfiddle.net/uDL8K/embedded/result/

【讨论】：

感谢您的称赞，我很高兴为您解决问题。古德日。

【解决方案3】：

标题css应该是这样的。

h1, h2, h3, h4, h5, h6 { 
  font: normal 200% 'Yanone Kaffeesatz', arial, sans-serif;
}

【讨论】：