Aligning label and textbox on same line (left and right)
I have an ASP.NET control. I want to align the textbox to the right and the label to the left.
I have this code so far:
<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>
The textbox aligns to the right,开发者_如何学C but the label aligns to the left and on the line above. How can I fix this so that the label is on the left, the textbox on the right, and both on the same line?
Thanks
you can use style
<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>
You should use CSS to align the textbox. The reason your code above does not work is because by default a div's width is the same as the container it's in, therefore in your example it is pushed below.
The following would work.
<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>
In your CSS file:
.cell
{
text-align:left;
}
.righttextbox
{
float:right;
}
You can do it with a table, like this:
<table width="100%">
<tr>
<td style="width: 50%">Left Text</td>
<td style="width: 50%; text-align: right;">Right Text</td>
</tr>
</table>
Or, you can do it with CSS like this:
<div style="float: left;">
Left text
</div>
<div style="float: right;">
Right text
</div>
精彩评论