如何减少html中标签和文本框之间的空间

Question

我正在设计一个html表单，我有一个标签和一个文本框，但在我的设计中，文本框和标签之间有一个很大的空间，我想减少它。

这是我的代码：

<tr>
  <td>
    <bean:message key="tml.registration.captcha.verification.code"/>
    <font color='red'>*</font>
  </td>
  <td>
    <input type="text" name="imageValidation" size="25" title="Enter verification Code"/>
  </td>
  <td>
    <logic:messagesPresent property="imageValidation">
      <font color="red"><html:errors property="imageValidation" /></font>
    </logic:messagesPresent>
  </td>
</tr> 

我希望验证码和文本框紧密对齐。有人请帮忙。
以下是当前状态的屏幕截图：

Answer 1

为td分配小宽度并应用nowrap样式。更新您的代码，如下所示。

<tr>
  <td width="3" nowrap>
    <bean:message key="tml.registration.captcha.verification.code" />
    <font color='red'>*      </font>
  </td>
  <td>
    <input type="text" name="imageValidation" size="25" title="Enter verification Code" />
  </td>
  <td>
    <logic:messagesPresent property="imageValidation"> 
      <font color="red"><html:errors property="imageValidation" /></font>
    </logic:messagesPresent>
  </td>
</tr>

修改

如果此table-row出现了很多其他内容，请在table内创建一个td，如下所示。

<tr>
  <td colspan="3">
    <table cellpadding="0" cellspacing="0" width="100%" border="0">
      <tr>
        <td width="3" nowrap>
          <bean:message key="tml.registration.captcha.verification.code" />
          <font color='red'>*</font>
       </td>
       <td>
          <input type="text" name="imageValidation" size="25" title="Enter verification Code" />
       </td>
       <td>
         <logic:messagesPresent property="imageValidation"> 
          <font color="red"><html:errors property="imageValidation" /></font>
         </logic:messagesPresent>
       </td>
      </tr>
    </table>       
 </tr>