右对齐表中的输入

Question

我正在尝试将文本输入对齐到表td的右侧，但没有结果。下面是我有：

.right { 
 
    text-align: right; 
 
}

<table width="100%"> 
 
    <tr> 
 
    <td width="50%"><input type="text" name="nome" id="nome" placeholder="Nome" /></td> 
 
    <td class="right"><input type="text" name="email" id="email" placeholder="Email" /></td> 
 
    </tr> 
 
    <tr> 
 
    <td colspan="2"><input type="text" name="msg" id="msg" placeholder="Mensagem" /></td> 
 
    </tr> 
 
    <tr> 
 
    <td colspan="2"> 
 
     <input type="submit" id="sendform" value="Enviar"> 
 
    </td> 
 
    </tr> 
 
</table>

Answer 1

第二<input>右对齐的<td>内。
但是<input>也恰好与<td>一样宽。

运行此操作以查看强制<td>稍宽一些后会发生什么，并且<input>稍微窄一些。 （我还添加边框，使效果更为明显），究竟你右对齐的意思

td { 
 
    border: 1px solid black; 
 
    width: 100px; 
 
} 
 

 
input[type="text"] { 
 
    width: 60px; 
 
} 
 

 
.right { 
 
    text-align: right; 
 
}

<table> 
 
    <tr> 
 
    <td width="50%"><input type="text" name="nome" id="nome" placeholder="Nome" /></td> 
 
    <td class="right"><input type="text" name="email" id="email" placeholder="Email" /></td> 
 
    </tr> 
 
    <tr> 
 
    <td colspan="2"><input type="text" name="msg" id="msg" placeholder="Mensagem" /></td> 
 
    </tr> 
 
    <tr> 
 
    <td colspan="2"> 
 
     <input type="submit" id="sendform" value="Enviar"> 
 
    </td> 
 
    </tr> 
 
</table>