[asp.net] 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, 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

This question is related to asp.net css

The answer is


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>