css - 在表单中动态添加新字段时无法固定表单字段位置

Question

我有一个简单的密码重置对话框，使用户能够设置自定义密码。

<form id="resetPassword"
action="XXXXX">
<fieldset><input type="hidden" name="userId" value="${user.id}" />
<table>
<tbody>
<tr>
    <td><input id="resetCustomPassword" class="ui-widget" type="checkbox"></td>
    <td><label>Set Custom Password</label></td>     
</tr>
</tbody>
<tbody style="display: none;">
<tr>
    <td><label for="newPassword"> New Password: </label></td>
    <td><input id="newPassword" class="ui-widget" type="password"></td>
</tr>
<tr>
    <td><label for="reTypeNewPassword"> Retype New Password: </label></td>      
    <td><input id="reTypeNewPassword" class="ui-widget" type="password"></td>
</tr>
</tbody>

现在，如果用户选中“设置自定义密码”，我会动态显示新密码字段。问题出在我上面表格中的这个标签中:

 <td><label>Set Custom Password</label></td>

这会动态调整到右侧，因此它与新的密码字段对齐。 如何让我上面的标签是静态的，而不是动态调整的？

谢谢!

Answer 1

试试这个:

<td align="left"><label>Set Custom Password</label></td>

最好使用带样式的无序列表作为表单的容器，而不是表格。

参见:http://www.alistapart.com/articles/multicolumnlists