テーブルの右揃え入力

Question

テキスト入力をテーブルの右側に配置しようとしていますが、結果は表示されません。ここで私が持っているものです。

.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>