將標籤和文本框對齊在同一行（左側和右側）

Question

我有一個ASP.NET控件。我想將文本框對齊到右側，將標籤對齊到左側。

我到目前爲止這樣的代碼：

 <td colspan="2"> 


       <asp:Label ID="Label6" runat="server" Text="Label"></asp:Label> 


     <div style="text-align: right">  
       <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox> 
     </div> 

     </td> 

文本框對齊到正確的，但標籤對齊到左邊和上面的線。我該如何解決這個問題，以便標籤位於左側，文本框在右側，並且位於同一行？

感謝

Answer 1

你可以使用樣式

<td colspan="2"> 
    <div style="float:left; width:80px"><asp:Label ID="Label6" runat="server" Text="Label"></asp:Label></div> 

    <div style="float: right; width:100px">  
      <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox> 
    </div> 

    <div style="clear:both"></div> 

    </td> 

Answer 2

你可以用一個表做，像這樣：

<table width="100%"> 
    <tr> 
    <td style="width: 50%">Left Text</td> 
    <td style="width: 50%; text-align: right;">Right Text</td> 
    </tr> 
</table> 

或者，你可以用這樣的CSS做到這一點：

<div style="float: left;"> 
    Left text 
</div> 
<div style="float: right;"> 
    Right text 
</div> 

Answer 3

shoul You d使用CSS來對齊文本框。上面的代碼無法正常工作的原因是因爲默認情況下，div的寬度與其所在的容器相同，因此在您的示例中它會被推到下面。

以下是可行的。

<td colspan="2" class="cell"> 
       <asp:Label ID="Label6" runat="server" Text="Label"></asp:Label>   
       <asp:TextBox ID="TextBox3" runat="server" CssClass="righttextbox"></asp:TextBox>  
</td> 

在你的CSS文件：

.cell 
{ 
text-align:left; 
} 

.righttextbox 
{ 
float:right; 
}