将标签和文本框对齐在同一行（左侧和右侧）

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; 
}